Creating a sliding effect with JavaScript
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras risus enim, sagittis in, sodales et,
sagittis eget, justo. In rhoncus cursus nisl. Sed interdum velit ut mi ultrices pulvinar. Etiam luctus
vestibulum sapien. Etiam eleifend interdum lectus. Sed sit amet mi sit amet mi bibendum eleifend.
Donec nisl leo, hendrerit vitae, egestas at, tincidunt ac, urna. Praesent non sapien a purus fermentum rhoncus.
Duis dapibus.
This vertical sliding effect was created using JavaScript.
To use this control on your own page you will need to download the following file:
You will need include the JavaScript file in the header of your web page.
<script type="text/javascript" src="scripts/VerticalSlide.js"></script>
After creating the DIV you want to add the sliding effect to, create a JavaScript function for your button to call which will activate the sliding effect.
<script type="text/javascript">
function makeSlide(objName)
{
new VerticalSlide(objName);
}
</script>
For more information on how the sliding functionality works please read the comments in the VerticalSlide.js file.
If you are looking to add a horizontal sliding effect you may download the following JavaScript file:
After including the HorizontalSlide.js file in your web page you will need to make a JavaScript function to activate the sliding effect.
<script type="text/javascript">
function makeSlide(objName)
{
new HorizontalSlide(objName);
}
</script>
For more information on how the sliding functionality works please read the comments in the HorizontalSlide.js file.
Chris Manciero