基于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 相关文章推荐
Javascript 阻止javascript事件冒泡,获取控件ID值
Jun 27 Javascript
怎么判断js脚本加载完成
Feb 28 Javascript
javascript对JSON数据排序的3个例子
Apr 12 Javascript
基于jPlayer三分屏的制作方法
Dec 21 Javascript
详解jQuery选择器
Dec 21 Javascript
JS模拟实现ECMAScript5新增的数组方法
Mar 20 Javascript
AngularJs 终极购物车(实例讲解)
Nov 08 Javascript
vue新vue-cli3环境配置和模拟json数据的实例
Sep 19 Javascript
详解微信小程序中组件通讯
Oct 30 Javascript
vue进入页面时滚动条始终在底部代码实例
Mar 26 Javascript
小程序根据手机机型设置自定义底部导航距离
Jun 04 Javascript
微信小程序云开发如何实现数据库自动备份实现
Aug 16 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
php.ini-dist 和 php.ini-recommended 的区别介绍(方便开发与安全的朋友)
2012/07/01 PHP
深入理解:XML与对象的序列化与反序列化
2013/06/08 PHP
Yii框架关联查询with用法分析
2014/12/02 PHP
PHP实现的杨辉三角求解算法分析
2019/03/11 PHP
JavaScript中“过于”犀利地for/in循环使用示例
2013/10/22 Javascript
js设置文本框中焦点位置在最后的示例代码(简单实用)
2014/03/04 Javascript
jquery实现用户信息修改验证输入方法汇总
2015/07/18 Javascript
基于JQuery和CSS3实现仿Apple TV海报背景视觉差特效源码分享
2015/09/21 Javascript
JavaScript对象数组的排序处理方法
2015/10/21 Javascript
JavaScrip常见的一些算法总结
2015/12/28 Javascript
浅析javascript异步执行函数导致的变量变化问题解决思路
2016/05/13 Javascript
js将滚动条滚动到指定位置的简单实现方法
2016/06/25 Javascript
基于bootstrap-datetimepicker.js不支持IE8的快速解决方法
2016/11/07 Javascript
jQGrid Table操作列中点击【操作】按钮弹出按钮层的实现代码
2016/12/05 Javascript
JS返回只包含数字类型的数组实例分析
2016/12/16 Javascript
jQuery中的一些小技巧
2017/01/18 Javascript
node.js将MongoDB数据同步到MySQL的步骤
2017/12/10 Javascript
Express下采用bcryptjs进行密码加密的方法
2018/02/07 Javascript
[48:22]VGJ.S vs VG 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
[01:28]一分钟告诉你DOTA2 TI9不朽宝藏Ⅱ中有什么!
2019/07/09 DOTA
[52:20]DOTA2-DPC中国联赛正赛 SAG vs XGBO3 第一场 3月5日
2021/03/11 DOTA
Python从MP3文件获取id3的方法
2015/06/15 Python
python 链接和操作 memcache方法
2017/03/04 Python
python+opencv实现的简单人脸识别代码示例
2017/11/14 Python
Python中Scrapy爬虫图片处理详解
2017/11/29 Python
Python设计模式之原型模式实例详解
2019/01/18 Python
代码详解django中数据库设置
2019/01/28 Python
深入浅析Python 函数注解与匿名函数
2020/02/24 Python
pandas分批读取大数据集教程
2020/06/06 Python
pyCharm 实现关闭代码检查
2020/06/09 Python
Python实现王者荣耀自动刷金币的完整步骤
2021/01/22 Python
英文求职信写作小建议
2014/02/16 职场文书
2014年政府采购工作总结
2014/12/09 职场文书
幼儿园大班毕业评语
2014/12/31 职场文书
食堂管理制度范本
2015/08/04 职场文书
Vue3中toRef与toRefs的区别
2022/03/24 Vue.js