Spry 効果の概要

Spry 効果 は、JavaScript を使用して HTML ページのほぼすべてのエレメントに適用できる視覚効果です。 効果は、情報の強調、移行アニメーションの作成、ページエレメント外観の一時的な変更などによく使用されます。 HTML エレメントに効果を適用するときに、追加のカスタムタグは不要です。

注意： エレメントに効果を適用するには、そのエレメントが現在選択されているか、ID を持っている必要があります。 たとえば、現在選択されていない div タグにハイライト表示を適用する場合は、この div が有効な ID 値を持つ必要があります。 このエレメントに有効な ID 値がない場合は、その HTML コードに有効な ID 値を追加する必要があります。

効果を使用すると、エレメントの透明度、拡大/縮小率、位置、およびスタイルプロパティ (背景色など) を変更できます。 複数のプロパティを組み合わせると、おもしろい視覚効果を作成できます。

これらの効果は Spry をベースにしているため、効果が適用されたエレメントをユーザーがクリックすると、HTML ページ全体が更新されることなく、そのエレメントのみが動的に更新されます。

Spry には次の効果があります。

表示/フェード
エレメントを表示またはフェードアウトします。

ハイライト
エレメントの背景色を変更します。

ブラインド
上下に動く窓用ブラインドのようにエレメントの表示/非表示を切り替えます。

スライド
エレメントを上下に動かします。

拡張/縮小
エレメントのサイズを拡大または縮小します。

シェイク
左から右へのエレメントの揺れをシミュレートします。

スキッシュ
エレメントをページの左上隅に消します。

重要： 効果を使用すると、コードビューでファイルにさまざまなコード行が追加されます。 1 つの行では SpryEffects.js ファイルを特定しています。これは効果を含めるために必要です。 この行をコードから削除しないでください。削除した場合効果が機能しなくなります。

Spry フレームワークで使用可能な Spry 効果の詳細については、www.adobe.com/go/learn_dw_spryeffects_jp を参照してください。