您好,欢迎来到世娱网。
搜索
您的当前位置:首页Jquery代码实现图片轮播效果(一)_javascript技巧

Jquery代码实现图片轮播效果(一)_javascript技巧

来源:世娱网
 文章写的不好,还请各位高手指教,不废话了,先上张效果图吧看下:

在线演示 下载源码

首先是初始化部分:将除了第一张轮播图片意外的图片都隐藏,并且隐藏向前、向后按钮,使第一个索引按钮处于激活状态。

事件部分:通过jquery的hover()绑定鼠标上悬以及离开时的事件处理, jquery的bind()方法绑定鼠标点击事件处理向前、向后翻动、轮播控制:pre(), next(), play(), start()开始自动轮播,stop()停止自动轮播。

下篇是一个纯粹的jquery轮播插件, 该插件可以定制各种效果,方便的配置以及可扩展。

下面是整体的代码:

index.html
[html] view plaincopy
 
 
 
 
jquery轮播效果图  
 
 

至此一个简单的jquery轮播效果就完成了,当然还有很多需要改进的地方。

Copyright © 2019- worldimage.cn 版权所有

违法及侵权请联系:TEL:199 18 7713 E-MAIL:2724546146@qq.com

本站由北京市万商天勤律师事务所王兴未律师提供法律服务