フライアウトズームビュー flyout-zoom-view
メインビューは、静的な画像と、静的な画像の上のフライアウトビューに表示されるズームされた画像で構成されます。 また、静的画像の上に表示される先端メッセージでも構成されます。
メインビューの CSS プロパティ
メインビューの外観は、次の CSS クラスセレクターで制御します。
.s7flyoutviewer .s7flyoutzoomview
CSS プロパティ
説明
の背景色の
メインビューの背景色。
例 – メインビューを透明にするには:
.s7flyoutviewer .s7flyoutzoomview {
background-color: transparent;
}
Tip メッセージの CSS プロパティ
先端メッセージの外観は、次の CSS クラスセレクターで制御します。
.s7flyoutviewer .s7flyoutzoomview .s7tip
CSS を使用すると、フォントスタイル、サイズ、外観、垂直オフセットを設定できます。 ただし、水平方向の整列はビューアのロジックで管理されます。 left
または right
プロパティを使用した CSS による上書きはサポートされていません。
CSS プロパティ
説明
下
メイン ビューの下部からのオフセット。
color
テキストのカラー。
フォントファミリーの
フォント名。
font-size
フォントサイズ。
padding
メッセージテキストの周囲のパディング。
の背景色の
メッセージテキストの背景色。
border-radius
メッセージテキストの背景色の半径。
opacity
メッセージテキストの背景の不透明度。
Internet Explorer 8 の場合は、filter:alpha (opacity-...) を使用 ます。
ヒント メッセージはローカライズできます。 詳しくは、 ユーザーインターフェイス要素のローカライゼーションを参照してください。
.
例 – 白い Arial® 12 ピクセルのフォント、メインビューの下部からの 50 ピクセルのオフセット、パディング、丸い境界線を使用して、半透明の先端メッセージを設定するには:
.s7flyoutviewer .s7flyoutzoomview .s7tip {
bottom: 50px;
color: #ffffff;
font-family: Arial;
font-size: 12px;
padding-bottom: 10px;
padding-top: 10px;
padding-left: 12px;
padding-right: 12px;
background-color: #000000;
border-radius: 4px;
opacity: 0.5;
filter: alpha(opacity = 50);
}
recommendation-more-help
b7426f53-aad9-4c00-83fc-664f30f681e8