Icon effect

Last update: 2022-01-27
  • Created for:
  • Developer

The spin indicator is overlaid on the main view area. It is displayed when the image is in a reset state and it also depends on the iconeffect parameter.

CSS properties of the main viewer area

The appearance of the viewing area is controlled with the following CSS class selector:

.s7spinviewer .s7spinview .s7iconeffect

CSS property



Spin indicator artwork.


Position inside artwork sprite, if CSS sprites are used.

See CSS Sprites .


Spin indicator width.


Spin indicator height.

Spin indicator supports the state attribute selector which is set to spin_1D if there is a single-dimensional spin set, and to spin_2D if there is a multi-dimensional spin set.

Example - to set up a 100 x 100 pixels zoom indicator.

.s7spinviewer .s7spinview .s7iconeffect {
 width: 100px;
 height: 100px;
.s7spinviewer .s7spinview .s7iconeffect[state="spin_1D"] {
background-image: url(images/spinIcon_1D.png);
.s7spinviewer .s7spinview .s7iconeffect[state="spin_2D"] {
background-image: url(images/spinIcon_2D.png);

On this page