大きい [ 前のページ ] ボタン large-previous-page-button

このボタンを選択すると、カタログ内の前のページに移動します。 このボタンはメイン コントロール バーに表示されます。 このボタンは、画面の領域を節約するために携帯電話には表示されません。 このボタンのサイズ、スキンおよび位置は、CSS を使用して設定できます。

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

ボタンの外観は、次の CSS クラスセレクターで制御します。

.s7ecatalogsearchviewer .s7ecatleftbutton .s7panleftbutton

CSS プロパティ
説明
メイン コントロール バーの上端からパディングを含めて配置します。
right
メインコントロールバーの右端からパディングを含めて配置します。
left
メイン コントロール バーの左の境界線からパディングを含めて配置します。
メイン コントロール バーの下枠からパディングを含めて配置します。
ボタンの幅。
高さ
ボタンの高さ。
background-image
特定のボタン状態に対して表示される画像。
background-position

CSS スプライトを使用する場合、アートワークスプライト内に配置します。

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

NOTE
このボタンでは、ボタンの状態に応じて異なるスキンを適用するために使用できる state 属性セレクターをサポートしています。

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

例 – 56 x 56 ピクセルの大きな「前のページ」ボタンを、垂直方向に中央に配置し、左側のビューアの境界線にアンカーして、4 つの異なるボタンの状態ごとに異なる画像を表示するように設定します。

.s7ecatalogsearchviewer .s7ecatleftbutton .s7panleftbutton {
bottom:50%;
margin-bottom:-28px;
left:0px;
width:56px;
height:56px;
}
.s7ecatalogsearchviewer .s7ecatleftbutton .s7panleftbutton [state='up'] {
background-image:url(images/v2/LeftButton_dark_up.png);
}
.s7ecatalogsearchviewer .s7ecatleftbutton .s7panleftbutton [state='over'] {
background-image:url(images/v2/LeftButton_dark_over.png);
}
.s7ecatalogsearchviewer .s7ecatleftbutton .s7panleftbutton [state='down'] {
background-image:url(images/v2/LeftButton_dark_down.png);
}
.s7ecatalogsearchviewer .s7ecatleftbutton .s7panleftbutton [state='disabled'] {
background-image:url(images/v2/LeftButton_dark_disabled.png);
}
recommendation-more-help
b7426f53-aad9-4c00-83fc-664f30f681e8