浏览 1657 次
|
锁定老帖子 主题：他山之石---ImageSlider
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2011-04-13
最后修改：2011-04-14
上周闲逛看见此贴http://www.iteye.com/topic/986779?page=2#2030186，楼主向我们展示了他玩JS玩得有多遛。本着学习的原则研究了一下，发现思路大有可取之处，于是根据楼主的原理打造成了 ImageSlider0.5。
首先来关注一下使用方法：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>My ImageSlider</title>
<script type="text/javascript" src="jquery-1.3.min.js"></script>
<script type="text/javascript" src="imageSlider.js"></script>
<script type="text/javascript">
var slider;
$(document).ready(function(){
slider = new ImageSlider(400,300);
//加一张图片
slider.add("images/car4.jpg");
//批量加图片 images目录下有 car1-car4 四张图片
slider.batchAdd({baseDir:"images",prefix:"car",begin:1,end:4});
slider.renderTo('slider');
}
)
</script>
</head>
<body>
<div id="slider">
</div>
<input type="button" onclick="slider.next()" value="next"></input>
</body>
</html>
效果图： 
源代码及图片打包下载。 如要修改代码，请联系本人。美女如有不明白，可请教本人。 声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
推荐链接
|
| 返回顶楼 | |
