HTML5 Viewer SDK API Documentation 

Namespaces


Class Index

Classes in s7sdk.common

Class s7sdk.common.ScrollLeftRightButton


Extends s7sdk.common.Button, s7sdk.common.TwoStateButton.

The ScrollLeftRightButton is a two state button that is used to controlBar scrolling.

Currently this component does not support any modifiers.

Defining Appearance using CSS

You can define the appearance of the ScrollLeftRightButton component using CSS rules. All HTML5 Viewer SDK components use class selectors for styling. You can style the body of the ScrollLeftRightButton component by using the .s7scrollleftrightbutton class selector. The styles that are associated with this class selector are applied to all instances of the ScrollLeftRightButton component. You can style particular instances by prefixing the class rule with the instance #id. For example, styling rules for #myComp.s7scrollleftrightbutton are applied only to the particular ScrollLeftRightButton instance.

CSS ClassAttribute SelectorDescription
.s7scrollleftrightbuttonselected=[true|false] state=[up|over|down|disabled]Define appearance of SearchButton for each state, independently for selected and unselected case.
.s7tooltip(None)A global class selector that defines appearance for the tooltips. To disable tooltips set the display style to none.

Localizable Symbols

ScrollLeftRightButton also has text symbols that you can localize either in a preset or in the viewer page though the mechanisms provided by the ParameterManager. For more information on localization consult the ParameterManager API documentation and HTML5 Viewers SDK User Guide.

SymbolDescription
ScrollLeftRightButton.TOOLTIP_SELECTEDTooltip for selected button state
ScrollLeftRightButton.TOOLTIP_UNSELECTEDTooltip for unselected button state

Class Summary
Constructor Attributes Constructor Name and Description
 
s7sdk.common.ScrollLeftRightButton(container, settings, compId)
Methods borrowed from class s7sdk.common.Button:
activate, addEventListener, blur, deactivate, dispose, focus, getHeight, getWidth, resize, setCSS
Methods borrowed from class s7sdk.common.TwoStateButton:
isSelected, setSelected
Class Detail
s7sdk.common.ScrollLeftRightButton(container, settings, compId)
Default styles for ScrollLeftRightButton:

.s7scrollleftrightbutton {
	width:25px;
	height:25px;
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center;
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	position:absolute;
 }
.s7scrollleftrightbutton[selected='true'][state='up'] {
	background-image:url(images/sdk/controlbarleftbutton_dark_up.png);
 }
.s7scrollleftrightbutton[selected='true'][state='over'] {
	background-image:url(images/sdk/controlbarleftbutton_dark_over.png);
 }
.s7scrollleftrightbutton[selected='true'][state='down'] {
	background-image:url(images/sdk/controlbarleftbutton_dark_down.png);
 }
.s7scrollleftrightbutton[selected='true'][state='disabled'] {
	background-image:url(images/sdk/controlbarleftbutton_dark_disabled.png);
 }
.s7scrollleftrightbutton[selected='false'][state='up'] {
	background-image:url(images/sdk/controlbarrightbutton_dark_up.png);
 }
.s7scrollleftrightbutton[selected='false'][state='over'] {
	background-image:url(images/sdk/controlbarrightbutton_dark_over.png);
 }
.s7scrollleftrightbutton[selected='false'][state='down'] {
	background-image:url(images/sdk/controlbarrightbutton_dark_down.png);
 }
.s7scrollleftrightbutton[selected='false'][state='disabled'] {
	background-image:url(./images/sdk/controlbarrightbutton_dark_disabled.png);
 }
Parameters:
{String|Container} container
The reference to Container instance, ControlBar instance or the ID of the parent DOM element to which the component is added as a child
{s7sdk.ParameterManager} settings
A parameter manager instance that represents the desired configuration.
{String} compId
An optional parameter that specifies the ID of the component DOM element.

Documentation generated by JsDoc Toolkit 2.4.0 on Thu Jan 30 2020 16:40:36 GMT+0200 (EET)