ズームリセットボタン

このボタンをクリックまたはタップすると、メイン表示の画像がリセットされます。 このボタンは、デスクトップシステムおよびタブレットでは、メインコントロールバーに表示されます。 携帯電話では、このボタンは画像の上の中央下に表示されます。 ただし、画像がリセット状態の場合は表示されません。 このボタンのサイズ設定、スキン表示および配置は、CSSを使用して行うことができます。

メインビューア領域のCSSプロパティ

ボタンの外観は、以下のCSSクラスセレクターを使用して制御します。

.s7ecatalogviewer .s7zoomresetbutton

CSSプロパティ

説明

トップ

メインコントロールバー(デスクトップおよびタブレットの場合)またはビューア(携帯電話の場合)の上の境界線からの位置(パディングを含む)。

メインコントロールバー(デスクトップおよびタブレットの場合)またはビューア(携帯電話の場合)の右の境界線からの位置(パディングを含む)。

メインコントロールバー(デスクトップおよびタブレットの場合)またはビューア(携帯電話の場合)の左の境界線からの位置(パディングを含む)。

メインコントロールバー(デスクトップおよびタブレットの場合)またはビューア(携帯電話の場合)の下の境界線からの位置(パディングを含む)。

width

ボタンの幅。

height

ボタンの高さ。

background-image

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

background-position

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

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

メモ

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

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

例 — 28 x 28ピクセルで、(デスクトップ上の)メインコントロールバーの下から4ピクセルおよび右端から47ピクセルの位置に配置し、ボタンの4つの状態ごとに異なる画像を表示するズームリセットボタンを設定します。

.s7ecatalogviewer .s7zoomresetbutton { 
bottom:4px; 
right:47px; 
width:28px; 
height:28px; 
} 
.s7ecatalogviewer .s7zoomresetbutton [state='up'] { 
background-image:url(images/v2/ZoomResetButton_dark_up.png); 
} 
.s7ecatalogviewer .s7zoomresetbutton [state='over'] {  
background-image:url(images/v2/ZoomResettButton_dark_over.png); 
} 
.s7ecatalogviewer .s7zoomresetbutton [state='down'] {  
background-image:url(images/v2/ZoomResetButton_dark_down.png); 
} 
.s7ecatalogviewer .s7zoomresetbutton [state='disabled'] { 
background-image:url(images/v2/ZoomResetButton_dark_disabled.png); 
}

このページ

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
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