SmoothSlide Object



 
The SmoothSlide object handles the smooth slide effect.


Members Table

    The following table lists the members provided by the SmoothSlide object.

    Members
    Properties Description
    Duration Duration of the slide effect.
    EndPos End position of the slide effect.
    Position Position of the slide effect.
    Rate Rate of the slide effect.
    StartPos Start position of the slide effect.
    Methods Description
    Start Starts the slide effect.
    Stop Stops the slide effect.
    Events Description
    OnStart Fires when the slide is started.
    OnStop Fires when the slide is stopped.
    OnUpdatePosition Fires when the position changes.

Remarks
    This object is returned by the CreateSmoothSlide method. Use the SmoothSlide object to define the settings of the slide effect.

    Note that the path of a file using SiteKiosk objects must be allowed in the
    SiteKiosk configuration (Security -> Access -> URL's With Script Permission)
    if it is not a browser skin file.
Examples
    The following example shows the functionality of the slide effect.

    <html>
    <head>
    <SCRIPT TYPE="text/javascript">
    window.external.InitScriptInterface();
    myslide = SiteKiosk.Effects.CreateSmoothSlide();
    myslide.StartPos = 0;
    myslide.EndPos = 470;
    myslide.Rate = 100;
    myslide.Duration = 2000;
    myslide.OnUpdatePosition = OnUpdatePosition;
    myslide.OnStart = OnStart;
    myslide.OnStop = OnStop;
    function OnUpdatePosition(pos)
    {
       sldiv.style.pixelLeft = parseInt(pos);
    }
    function OnStart()
    {
       id_slst.innerHTML = "Status: started";
    }
    function OnStop()
    {
       id_slst.innerHTML = "Status: stopped";
       switchstartend();
    }
    function startslide()
    {
       myslide.Start();
    }
    function switchstartend()
    {
       sldummy = myslide.StartPos;
       myslide.StartPos = myslide.EndPos;
       myslide.EndPos = sldummy;
    }
    </SCRIPT>
    </head>
    <body>
    <table border="0" bgcolor="#ebebeb" width="600" cellspacing="5"
    cellpadding="5" style="font-family:verdana;font-size:8pt;"
    align="center">
    <tr><td bgcolor="f8f8f8">
    The following example shows the functionality of the slide
    effect. For example the sliding SiteKiosk progressbar is
    based on this object.
    </td></tr>
    <tr><td style="font-family:verdana;font-size:8pt;">
    <pre>
    <div id="sldiv" style="position:relative;left:0;">
    <SCRIPT TYPE="text/javascript">
    logosrc = SiteKiosk.SiteKioskDirectory;
    logosrc += "skins/Default/img/background/logo.gif";
    document.writeln("<img src='" + logosrc + "'>");
    </SCRIPT>
    </div>
    <br>
    <span style="color:#cc3300;" id="id_slst">Status: stopped</span>
    </pre>
    </td></tr>
    </table>
    <br><br>
    <div align="center">
    <a href="javascript:startslide()">
    Start slide
    </a>
    </div>
    </body>
    </html>
    

Applies to
    SiteKiosk v5.0 (and later versions).

Back to top