Here is a simple guide on how to put CrossSlide on a website:
Download the jQuery library and include it along with my plugin in the head section of your website:
<script src="jquery.min.js"></script>
<script src="jquery.cross-slide.min.js"></script>
Put a block element somewhere in your page and give it an id:
<div id="slideshow"></div>
Make sure the element has a fixed size, even when emptied of its contents, by setting its width and height in the CSS stylesheet:
#slideshow {
width: 600px;
height: 200px;
}
Open a script tag, define a "document ready handler" and activate my plugin on the div you created in step 2:
<script>
$(function() {
$('#slideshow').crossSlide({
sleep: 2,
fade: 1
}, [
{ src: 'picture1.jpg' },
{ src: 'picture2.jpg' },
{ src: 'picture3.jpg' },
{ src: 'picture4.jpg' }
])
});
</script>
No comments:
Post a Comment