基于jQuery图片平滑连续滚动插件


Posted in Javascript onApril 27, 2009

* 此插件要求运行在jQuery v1.3 或更高版本上
* 插件可以实现图片平滑向上或向左滚动
* 如果您需要更多的效果或在使用中本插件存在BUG,可以给在彦磊的博客上留言,彦磊将尽自己最大努力完善此插件
* 您留言前请先到:http://gmarwaha.com/jquery/jcarousellite/ 上面下载jcarousellite插件 
* 来和彦磊图片平滑滚动的插件相互补充使用以获取更多的图片效果
* 彦磊图片平滑滚动插件只是对jcarousellite插件的补充
*
*
* 技术支持:HTTP://HI.BAIDU.COM/DPXDQX
* 此为自由拷贝版本,您可以在此基础上添加任何功能
* 彦磊建议您将修改过的版本或发布地址发到彦磊博客上以共享,也建议您保留部分彦磊的信息
*
*
* 此插件没有象jcarousellite插件样对相关元素的CSS全自动设置,部分CSS样式需要您为设置
* 原因很简单:您需要考虑部分用户的浏览器不支持JAVASCRIPT或相关功能被禁用
* 您需要让您的页面元素布局在此时也能显示正确,因此必要的CSS设置还需要您自己来做。
*
* 使用前您一定要引入jQurey及本脚本,如
* <script type="text/javascript" src="js/jquery_last.js"></script>
* <script type="text/javascript" src="js/YlMarquee.js">
* 使用方法:
*
* 1、为您要设置滚动的对象设置容器,并命名class,如class="ylMarquee"
* 2、将您要滚动的对象置入<ul></ul>中,并添加li标签,li标签中可以是图片、文字或表格……
* 3、此版本需要您设置每个li列表的宽度或高度一至
* <div class="ylMarquee">
* <ul>
* <li><img src="image/1.jpg" alt="1"></li>
* <li><img src="image/2.jpg" alt="2"></li>
* <li><img src="image/3.jpg" alt="3"></li>
* </ul>
* </div>
* 4、设置ylMarquee的height或width样式——向上滚动必须设置height的大小,向左滚动必须设置width的大小,否则页面将显示不正常。
* 5、在页面中添加jQuery语句,调用此插件,并对相关参数进行设置,如:
* <script type="text/javascript">
* $(document).ready(function(){
* $(".stroll").jMarquee({
* visible:3,
* step:1,
* direction:"left"
* });
*});
* </script>
* 6、插件相关参数:
* visible:页面可见元素(图片)个数,默认为1,必须参数。
* step:滚动步长,整数,默认为1,增大此数可加快滚动速度,设为0,则不进行滚动。
* direction:滚动方向,有"left"(向左滚动)和"up"(向上滚动)两个参数,注意设置时一定要加英文的双引("")号或单引号('')。
*/
演示地址:http://img.3water.com/online/jquery_pic/jquery_pic.htm
下载地址 http://img.3water.com/online/jquery_pic/jquery_pic_files/YlMarquee.js

Javascript 相关文章推荐
jquery tools系列 expose 学习
Sep 06 Javascript
解析Jquery取得iframe中元素的几种方法
Jul 04 Javascript
使用CSS和jQuery模拟select并附提交后取得数据的代码
Oct 18 Javascript
javascript时间函数大全
Jun 30 Javascript
轻松掌握JavaScript代理模式
Aug 26 Javascript
详解在Vue中通过自定义指令获取dom元素
Mar 04 Javascript
使用vue.js写一个tab选项卡效果
Mar 25 Javascript
解决BootStrap Fileinput手机图片上传显示旋转问题
Jun 01 Javascript
基于vue2.0动态组件及render详解
Mar 17 Javascript
node中间层实现文件上传功能
Jun 11 Javascript
vue组件中实现嵌套子组件案例
Aug 31 Javascript
vue项目查看vue版本及cli版本的实现方式
Oct 24 Javascript
js 发个判断字符串是否为符合标准的函数
Apr 27 #Javascript
jQuery 对象中的类数组操作
Apr 27 #Javascript
jquery遍历input取得input的name
Apr 27 #Javascript
jquery创建div 实现代码
Apr 27 #Javascript
js tab 选项卡
Apr 26 #Javascript
JavaScript 使用技巧精萃(.net html
Apr 25 #Javascript
RGB颜色值转HTML十六进制(HEX)代码的JS函数
Apr 25 #Javascript
You might like
rephactor 优秀的PHP的重构工具
2011/06/09 PHP
PHP中VC6、VC9、TS、NTS版本的区别与用法详解
2013/10/26 PHP
PHP中使用Imagick读取pdf并生成png缩略图实例
2015/01/21 PHP
PHP获取当前URL路径的处理方法(适用于多条件筛选列表)
2017/02/10 PHP
javascript圆盘抽奖程序实现原理和完整代码例子
2014/06/03 Javascript
在JavaScript里防止事件函数高频触发和高频调用的方法
2014/09/06 Javascript
javascript中字符串拼接详解
2014/09/26 Javascript
原生JS实现拖拽图片效果
2020/08/27 Javascript
Bootstrap前端开发案例一
2016/06/17 Javascript
如何利用模板将HTML从JavaScript中抽离
2016/10/08 Javascript
JS中substring与substr的用法
2016/11/16 Javascript
jQuery Datatables表头不对齐的解决办法
2017/11/27 jQuery
vue cli webpack中使用sass的方法
2018/02/24 Javascript
jquery实现联想词搜索框和搜索结果分页的示例
2018/10/10 jQuery
浅谈vue3中effect与computed的亲密关系
2019/10/10 Javascript
Jquery 动态添加元素并添加点击事件实现过程解析
2019/10/12 jQuery
JavaScript的垃圾回收机制与内存管理
2020/08/06 Javascript
解决vue与node模版引擎的渲染标记{{}}(双花括号)冲突问题
2020/09/11 Javascript
解决vant title-active-color与title-inactive-color不生效问题
2020/11/03 Javascript
在elementui中Notification组件添加点击事件实例
2020/11/11 Javascript
Python使用xlwt模块操作Excel的方法详解
2018/03/27 Python
12个步骤教你理解Python装饰器
2019/07/01 Python
简单了解Python write writelines区别
2020/02/27 Python
python pandas.DataFrame.loc函数使用详解
2020/03/26 Python
python安装sklearn模块的方法详解
2020/11/28 Python
欧铁通票官方在线销售网站:Eurail.com
2017/10/14 全球购物
The North Face北面法国官网:美国著名户外品牌
2019/11/01 全球购物
社会保险接收函
2014/01/12 职场文书
无故旷工检讨书
2014/01/26 职场文书
餐饮企业总经理岗位职责范文
2014/02/18 职场文书
《植物妈妈有办法》教学反思
2014/02/25 职场文书
工作求职信
2014/07/04 职场文书
教师批评与自我批评材料
2014/10/16 职场文书
新年晚会开场白
2015/05/29 职场文书
建国大业观后感600字
2015/06/01 职场文书
HTML5+CSS+JavaScript实现捉虫小游戏设计和实现
2021/10/16 HTML / CSS