これらの達成方法 (参考) の使用法及び、それらが WCAG 2.0 達成基準 (規定) とどのように関係するかに関する重要な情報については、WCAG 達成基準の達成方法を理解するを参照のこと。適用 (対象) セクションは、その達成方法の範囲について説明しており、特定の技術に関する達成方法があるからといって、WCAG 2.0 を満たすコンテンツを作成する際に、常にその技術が使用可能であるわけではない。
クライアントサイドスクリプティング
これは、次の達成基準に関連する達成方法である:
注記: この達成方法は、達成基準 1.4.4 に適合する他の達成方法と組み合わせなければならない。詳細については、 達成基準 1.4.4 を理解するを参照すること。
注記: この達成方法は、達成基準 1.4.8 に適合する他の達成方法と組み合わせなければならない。詳細については、 達成基準 1.4.8 を理解するを参照すること。
SCR34 に関するユーザエージェントサポートノートを参照のこと。
この達成方法の目的は、文字サイズが縮小拡大されるのに従って、適切に拡大縮小するように要素のサイズ及びポジションを定めることである。
ここに要素のサイズとポジションを決める JavaScript の 4 つプロパティがある:
offsetHeight (ピクセルでの要素の高さ)
offsetWidth (ピクセルでの要素の幅)
offsetLeft (ピクセルでの親要素 (offsetParent) の左からの距離)
offsetTop (ピクセルでの親要素 (offsetParent) の上からの距離)
offsetHeight や offsetWidth を用いて高さや幅を定めることは簡単である、しかし、オブジェクトの左とトップの位置を絶対配置の値として定める時、親要素を考える必要がある。下記において、calculatePosition 関数は、要素におけるすべての親ノードの最終的な値が決定するまで繰り返されている。その関数は objElement (当該の要素の名前) とオフセットプロパティ (offsetLeft 又は offsetTop ) の 2 つの引数を取っている。
Javascript の関数:
コード例:
function calculatePosition(objElement, strOffset)
{
var iOffset = 0;
if (objElement.offsetParent)
{
do
{
iOffset += objElement[strOffset];
objElement = objElement.offsetParent;
} while (objElement);
}
return iOffset;
}次の事例は、上の関数がオブジェクトを、参照オブジェクトの下、かつ、左から同じ距離に配置するために用いられていることを示している:
コード例:
// Get a reference object
var objReference = document.getElementById('refobject');
// Get the object to be aligned
var objAlign = document.getElementById('lineup');
objAlign.style.position = 'absolute';
objAlign.style.left = calculatePosition(objReference, 'offsetLeft') + 'px';
objAlign.style.top = calculatePosition(objReference, 'offsetTop') + objReference.offsetHeight + 'px';この参考リソースは、あくまでも情報提供のみが目的であり、推薦などを意味するものではない。
文字サイズの変更とともにテキストコンテナのサイズを調整するように設計されているページを開く。
ブラウザの文字サイズ調節を使って 200% のサイズまで大きくする。(ズーム機能は使用しない)
テキストコンテナのサイズが文字サイズに合わせて調整される。
文字サイズを大きくした結果、どの文字も「切り取られ」たり、見えなくなっていたりしない。
3.及び 4.を満たしている。
この達成方法が「十分な達成方法」の一つである場合、この手順や期待される結果を満たしていなければ、それはこの達成方法が正しく用いられていないことを意味するが、必ずしも達成基準を満たしていないことにはならない。場合によっては、別の達成方法によってその達成基準が満たされていることもありうる。