124种漂亮jquery特效源码.zip

  • hahaya
    了解作者
  • JavaScript
    开发工具
  • 43.1MB
    文件大小
  • zip
    文件格式
  • 0
    收藏次数
  • 1 积分
    下载积分
  • 0
    下载次数
  • 2018-11-24 21:01
    上传日期
jQuery编程经典案例,巩固JavaScript基础知识,可应用于网站
124种漂亮jquery特效源码.zip
内容介绍
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>jquery多款滚动条插件插件</title> <link type="text/css" href="css/lanrenzhijia.css" rel="stylesheet" /> </head> <body> <div id="header"> <div class="container"> <h1>Sly</h1> <p>jQuery插件为导航为基础支持方向滚动</p> <div class="download"> <h4>下载最新的</h4> <a href="http://github.com/Darsain/sly/raw/master/jquery.sly.js" class="left" rel='nofollow' onclick='return false;'><span>开发版本</span></a> <a href="http://github.com/Darsain/sly/raw/master/jquery.sly.min.js" class="right" rel='nofollow' onclick='return false;'><span>min版本</span></a> </div> <a href="http://github.com/Darsain/sly" class="repo ir" rel='nofollow' onclick='return false;'>Github上的仓库和文档</a> <ul id="nav" class="clearfix"> <li><a href="#horizontal" rel='nofollow' onclick='return false;'>水平</a></li> <li><a href="#vertical" rel='nofollow' onclick='return false;'>垂直</a></li> <li><a href="#stylesheet" rel='nofollow' onclick='return false;'>样式表</a></li> </ul> </div> </div> <div id="content"> <div id="sections" class="container"> <div class="scrollbox" id="horizontal"> <div class="slyWrap example1"> <div class="scrollbar"> <div class="handle"></div> </div> <div class="sly" data-options='{ "horizontal": 1, "itemNav": "basic", "dragContent": 1, "startAt": 3, "scrollBy": 1 }'> <ul class="big cfix"> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> </div> <ul class="pages"></ul> <div class="controls btn-toolbar"> <div class="btn-group"> <button class="btn prev">&laquo; 上一个</button> <button class="btn next">下一个 &raquo;</button> </div> <div class="btn-group"> <button class="btn prevPage">&laquo; 上一页</button> <button class="btn nextPage">下一页 &raquo;</button> </div> <div class="btn-group"> <button class="btn" data-action="toStart">开始</button> <button class="btn" data-action="toCenter">到中间</button> <button class="btn" data-action="toEnd">到底</button> </div> <div class="btn-group"> <button class="btn" data-action="toStart" data-arg="10"><strong>10</strong> 开始</button> <button class="btn" data-action="toCenter" data-arg="10"><strong>10</strong> 到中间</button> <button class="btn" data-action="toEnd" data-arg="10"><strong>10</strong> 到底</button> </div> <div class="btn-group"> <button class="btn" data-action="add">添加列表</button> <button class="btn" data-action="remove">移除列表</button> </div> </div> <pre class="prettyprint"> $frame.sly({ horizontal: 1, itemNav: "basic", dragContent: 1, startAt: 3, scrollBy: 1 }); </pre> </div><!--example1 end--> <hr> <div class="slyWrap example1"> <div class="scrollbar"> <div class="handle"></div> </div> <div class="sly" data-options='{ "horizontal": 1, "itemNav": "smart", "dragContent": 1, "startAt": 3, "scrollBy": 1 }'> <ul class="big cfix"> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> </div> <ul class="pages"></ul> <div class="controls btn-toolbar"> <div class="btn-group"> <button class="btn prev">&laquo; 上一个</button> <button class="btn next">下一个 &raquo;</button> </div> <div class="btn-group"> <button class="btn prevPage">&laquo; 上一页</button> <button class="btn nextPage">下一页 &raquo;</button> </div> <div class="btn-group"> <button class="btn" data-action="toStart">开始</button> <button class="btn" data-action="toCenter">到中间</button> <button class="btn" data-action="toEnd">到底</button> </div> <div class="btn-group"> <button class="btn" data-action="toStart" data-arg="10"><strong>10</strong> 开始</button> <button class="btn" data-action="toCenter" data-arg="10"><strong>10</strong> 到中间</button> <button class="btn" data-action="toEnd" data-arg="10"><strong>10</strong> 到底</button> </div> <div class="btn-group"> <button class="btn" data-action="add">添加列表</button> <button class="btn" data-action="remove">移除列表</button> </div> </div> <pre class="prettyprint"> $frame.sly({ horizontal: 1, itemNav: "smart", dragContent: 1, startAt: 3, scrollBy: 1 }); </pre> </div><!--example1 end--> <hr> <div class="slyWrap example2"> <div class="scrollbar"> <div class="handle"></div> </div> <div class="sly" data-options='{ "horizontal": 1, "itemNav": "centered", "dragContent": 1, "scrollBy": 1 }'> <ul class="big cfix"> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> </div> <ul class="pages"></ul> <div class="controls btn-toolbar"> <d
评论
    相关推荐