Show contents

Working with General Visual Components > Components > ScrollBar > Example of Creating the ScrollBar Component

Example of Creating the ScrollBar Component

To execute the example, connect the PP.js library and the PP.css visual styles table. Create horizontal and vertical scrollbars.

<script type="text/javascript">

    var hScrollBar = new PP.Ui.ScrollBar({

        ParentNode: document.getElementById("scroll1")      

    });

    hScrollBar.setSize(200, 16);

    hScrollBar.setDraggerSize(50);

    hScrollBar.updateSize();

    hScrollBar.setLeft(23);

    var vScrollBar = new PP.Ui.ScrollBar({

        ParentNode: document.getElementById("scroll2"),

        IsVertical: true

    });

    vScrollBar.setDraggerSize(50);

    vScrollBar.setTop(23);

    vScrollBar.setSize(16, 200);

    vScrollBar.updateSize();  

</script>

After executing the example horizontal and vertical scrollbars are placed on the HTML page:

See also:

ScrollBar