お気に入りメニュー

コントロールバーに、お気に入りメニューのドロップダウンリストが表示されます。 ボタンと、ユーザーがボタンをクリックまたはタップしたときに展開されるパネルで構成されます。 このパネルには、お気に入りツールが個別に含まれています。

ビューアユーザインターフェイスにおけるお気に入りメニューの位置とサイズは、以下のCSSクラスセレクターを使用して制御します。

.s7ecatalogviewer .s7favoritesmenu

お気に入りメニューボタンのCSSプロパティ

margin-top

コントロールバーの上端からのオフセット。

margin-left

左側の次のボタンまでの距離、または行の最初のボタンの場合はコントロールバーの左側までの距離です。

width

ボタンの幅。

height

ボタンの高さ。

例 — コントロールバーの上部から4ピクセル、最も近いボタンから10ピクセルの位置に配置し、サイズが28 x 28ピクセルのお気に入りメニューを設定します。

.s7ecatalogviewer .s7favoritesmenu { 
margin-top: 4px; 
margin-left: 10px; 
 width:28px; 
 height:28px; 
}

お気に入りメニューボタンの外観は、以下のCSSクラスセレクターを使用して制御します。

.s7ecatalogviewer .s7favoritesmenu .s7favoritesbutton

「お気に入り」ボタンのCSSプロパティ

background-image

ボタンの特定の状態に対して表示する画像。

background-position

CSSスプライトを使用する場合、アートワークスプライト内の位置。

CSSスプライトも参照してください。

メモ

このボタンでは、state属性セレクターがサポートされます。このセレクターは、ボタンの状態ごとに異なるスキンを適用するのに使用できます。

ボタンのツールチップをローカライズできます。 詳しくは、ユーザインターフェイス要素のローカライゼーションを参照してください。

例 — ボタンの4つの状態ごとに異なる画像を表示する、お気に入りメニューボタンを設定します。

.s7ecatalogviewer .s7favoritesmenu .s7favoritesbutton[state='up'] { 
background-image:url(images/v2/FavoritesMenu dark_up.png); 
} 
.s7ecatalogviewer .s7favoritesmenu .s7favoritesbutton[state='over'] { 
background-image:url(images/v2/FavoritesMenu_dark_over.png); 
} 
.s7ecatalogviewer .s7favoritesmenu .s7favoritesbutton[state='down'] { 
background-image:url(images/v2/FavoritesMenu_dark_down.png); 
} 
.s7ecatalogviewer .s7favoritesmenu .s7favoritesbutton[state='disabled'] { 
background-image:url(images/v2/FavoritesMenu_dark_disabled.png); 
}

個々のお気に入りアイコンを含むパネルの外観は、以下のCSSクラスセレクターを使用して制御します。

.s7ecatalogviewer .s7favoritesmenu .s7favoritesmenupanel

お気に入りメニューパネルのCSSプロパティ

background-color

パネルの背景色。

例 — 透明色を持つパネルを設定します。

.s7ecatalogviewer .s7favoritesmenu .s7favoritesmenupanel { 
 background-color: transparent; 
}

このページ

Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now