The plugins site is currently in development.
We've been looking to provide a higher-quality, spam-free experience at the plugins site for some time, and a major error on our part forced us to shut down the current site before we could put the new one in place. We are developing a new site, and you can follow along with its development on GitHub. For more information about this transition, including steps you can take as a plugin author to prepare, please read our post about what's going on.
jQuery slideShow plugin 1.0.1
1.0.0
Usage
- HTML Preparation
- Just a container and an unordered list which has links to the news page or something.
<div id="slideshow">
<ul class="slideView">
<li><a href="#"><img src="lib/slideView/images/1.jpg" alt="the description of image 1" /></a></li>
<li><a href="#"><img src="lib/slideView/images/2.jpg" alt="the description of image 1" /></a></li>
<li><a href="#"><img src="lib/slideView/images/3.jpg" alt="the description of image 1" /></a></li>
<li><a href="#"><img src="lib/slideView/images/4.jpg" alt="the description of image 1" /></a></li>
<li><a href="#"><img src="lib/slideView/images/5.jpg" alt="the description of image 1" /></a></li>
<li><a href="#"><img src="lib/slideView/images/5.jpg" alt="the description of image 1" /></a></li>
</ul>
</div>
- Load jQuery Libary
- You can directly add the following code in <head> tag：
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
- Load slideView Plugin
- <script type="text/javascript" src="slideview.js"></script>
- Assigning the target object
- Use it inside jQuery(document).ready() block:
$("#slideshow").slideView();
You can, of course , apply some change, customizing behaviours and appearance by the means of sending parameters to the method and modifying CSS：
$("#slideshow").slideView({
thumbPrefix: "thumb_",
slideBy : 1,
speed: 500
});
Code aboce will make slideView to load thumbnails of images, whose filenames match the pattern of "thumb_image-file-name.jpg" and so on. And also, the speed of slide is 500ms. - CSS Modification
- By default, images in the size of 460*300 will work perfectly, however, if you'd like to use images in different size, you need alter some lines in the css. See the description in the slideview.css. You won't miss it.