An image carousel thats really easy to implement.
DemoImageCarousel was designed for those that might get a little intimidated with the Javascript side of web sites.
How to Use
- Copy your carousel images into their own folder inside your project.
- Copy ImageCarousel.php into the folder from step one.
- Download and unzip the ImageCarousel files into your project folder. They should unzip into a folder called 'ImageCarousel'.
- Copy the following code into the head tag of your website.
<script src="http://ajax.googleapis.com/ajax/libs/mootools/1.2.4/mootools-yui-compressed.js" language="JavaScript" type="text/javascript" ></script>
<link href="ImageCarousel/ImageCarousel.css" rel="stylesheet" type="text/css">
<script src="ImageCarousel/ImageCarousel.js" language="JavaScript" type="text/javascript"></script> - Copy the following code into your webpage. This will act as the carousel element.
<div class="ImageCarousel auto" rel="Images/Carousel/" styles="width: 500px; height: 375px;"></div>
You need to change/check:- The 'rel' attribute should point to the folder where you have stored your images. The url should end with '/'.
- Your images should all have the same dimensions; Check the Carousel 'width' and 'height' match your image dimensions.
No comments:
Post a Comment