アイコン効果 icon-effect

Last update: Mon Jul 22 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

トピック：

作成対象：

開発者
ユーザー

ズームインジケーターがメインの表示領域に重なります。画像がリセット状態の場合に表示され、iconeffect パラメーターにも依存します。

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

表示領域の外観は、次の CSS クラスセレクターで制御します。

.s7basiczoomviewer .s7zoomview .s7iconeffect

CSS プロパティ

説明

background-image

ズームインジケーターのアートワーク。

background-position

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

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

幅

ズームインジケーターの幅。

高さ

ズームインジケーターの高さ。

NOTE

アイコンエフェクト media-type は、異なるデバイスに異なるアイコンエフェクトを適用するために使用できるアトリビュートセレクターがサポートされています。特に、media-type='standard' は、通常マウス入力が使用されるデスクトップシステムに対応し、media-type='multitouch' は、タッチ入力を持つデバイスに対応します。

例 – デスクトップシステムとタッチデバイスで異なるアートを使用して 100 x 100 ピクセルのズームインジケーターを設定する場合。

.s7basiczoomviewer .s7zoomview .s7iconeffect {
 width: 100px;
 height: 100px;
}
.s7basiczoomviewer .s7zoomview .s7iconeffect[media-type='standard'] {
 background-image:url(images/v2/IconEffect_zoom.png);
}
.s7basiczoomviewer .s7zoomview .s7iconeffect[media-type='multitouch'] {
 background-image:url(images/v2/IconEffect_pinch.png);
}

recommendation-more-help

b7426f53-aad9-4c00-83fc-664f30f681e8