随笔分类 - jquery
jquery插件之选项卡
摘要:jQuery插件编写 首先来一个简拓展jQuery对象的方法 jQuery的插件机制 1.jQuery.extend()方法有一个重载 jQuery.extend(object) ,一个参数用于扩展jQuery类本身,也就是用来在jQuery类/命名空间上增加新函数,或者叫静态方法,例如jQuery
阅读全文
jsonp
摘要:jsonp(json width padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题。由于同源策略,一般来说位于service.example.com的网页无法与不是service2.example.com的服务器沟通,而HTML的<script>元素是一个列外。
阅读全文
简单购物车
摘要:<div class="buynuminput"> <div class="reduce" id="reducenums"></div> <input type="number" id="cartnumbers" class="itnums" name="qty_item_1" value="1">
阅读全文
jQuery封装和优化
摘要:封装和优化插件 --封装插件 (function($){ //自定义插件代码 })(jQuery) (function($){ $.fn.extend({ //函数列表 }) })(jQuery) 优化插件 用户要发布自定义的插件,应该保证插件的开放性和封闭性 1.允许定义默认设置 把其中的参数默认
阅读全文
jquery的validate表单验证
摘要:html: <form id="reg" action="123.html"> <p class="myerror"></p> <p>帐号:<input type="text" name="user" id="user" /></p> <p>密码:<input type="text" name="p
阅读全文
jquery工具函数
摘要:jquery工具函数 $.trim() //去除两边的空格 $.each() //遍历数组 对数组array中的每一个元素,调用function函数处理,但没有返回值。 $.map() //修改数据 对数组array中的每个元素,调用function函数进行处理,然后将结果返回,得到一个新的数组。
阅读全文
jquery源码解读 (摘自jQuery源码分析系列图书(pdf)) 持续更新
摘要:1。总体架构 1.1自调用匿名函数 //自调用匿名函数 (function(window,undefined){ //jquery code})(window); 1.这是一个自调用匿名函数。第一个括号内创建一个匿名函数,第二个括号,立即执行2。为什么要创建这样一个“自调用匿名函数”呢???通过定义
阅读全文
导航栏对应相应的模块,可点击索引和滚动索引到需要到达的位置
摘要:参考图 ’ 实现原理offset().top html部分 直接上js 1,定义变量 var section=$(".section");//对应的区块var arr=[];//创建一个空数组var movetop="0"; //做一个true和false操作var $navBar=$(".navB
阅读全文
弹窗在大屏上居中对齐,在小屏上被挡住解决方案
摘要:效果图 由于我的页面要兼容IE7,因为我的遮罩有filter:alpha(通道设置的透明度),上面写什么会透明(所以这个层里面不能放东西),而且他一定要比我内容层低,所以我放出去了 最外面容器,设置超出自动出滚动条 弹窗主体内容 其他就直接上js
阅读全文
左侧菜单栏,有对个li对应一个content
摘要:html部分截图 不多说直接上js /*左侧导航栏*/var sect=$(".sect"); $(".nav-list .nav-a").each(function(i){ $(this).on("click",function(){ $(this).addClass("cur").sibling
阅读全文
分享插件的使用加一个echart走数据
摘要:html部分: <div class="topLink clearfix bdsharebuttonbox bdshare-button-style0-16" data-bd-bind="1489453330399" style="display: block;"> <a class="fl" hr
阅读全文
带自动的选项卡
摘要:html部分 <div class="navWrap"> <div class="nav clearfix"> <a class="active" href="javascript:;">赚钱</a> <a href="javascript:;">经典</a> <a href="javascript
阅读全文