首页前端开发HTML jQuery slide图片自动轮播滚动插件

jQuery slide图片自动轮播滚动插件

时间2024-05-20 03:36:03发布访客分类HTML浏览111
导读:jQuery slide图片自动轮播滚动插件 ˂meta name="keywords" content="图片轮播,图片滚动,jquery插件,轮播,slider,滚动,自动播放" /˃ ˂meta name="description"...

jQuery slide图片自动轮播滚动插件

图片轮播

.ck-slide { width: 700px; height: 320px; margin: 0 auto; }

.ck-slide ul.ck-slide-wrapper { height: 320px; }

  • 上一张 下一张

    • 1
    • 2
    • 3
    • 4
    • 5
    • 注:

      源码来自slider插件,自行添加鼠标移入圆点标记切换方法,新增垂直滚动方法,提供设置自动播放时间间隔参数设置。

      slide.min.js

      源码

      slide.js

      原有基础上增加

      目的:更好地理解插件,继而能更好的使用

      IE7

      IE8IE9FF下测试初步通过

      $('.ck-slide').ckSlide({

      autoPlay: true,//默认为不自动播放,需要时请以此设置

      dir: 'x',//默认效果淡隐淡出,x为水平移动,y 为垂直滚动

      interval:3000//默认间隔2000毫秒

      } );

      * { margin: 0; padding: 0; }

      html, body { height: 100%; overflow: hidden; }

      .main h1 { width: 100%; margin: 40px auto; font: 32px "Microsoft Yahei"; text-align:center; }

      /*注释*/

      .zhushi{ width:900px; margin: 30px auto; } /*注释*/

      .zhushi p{ line-height:24px; font-family:"微软雅黑"; font-size:16px; text-align:left; }

      声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!


      若转载请注明出处: jQuery slide图片自动轮播滚动插件
      本文地址: https://pptw.com/jishu/663881.html
      实用垂直选项卡js特效制作 svg与canvas结合动画制作

      游客 回复需填写必要信息