手风琴效果就是内容的折叠与打开,在这个插件中,使用了三种数据来源:1.直接写在DOM结构中:2.将数据写在配置项中:3.从Ajax()中获取数据.在这一版中,各项的切换没有添加动画效果,在下一版中会是有动画效果的. 在这个插件中,CSS和JS的配置非常重要,需要特别注意.另外,加个思考,请先看完后再想这个问题:当点击其中某项时,给width直接添加animate是否合适,当快速在其上移动时,如何保证效果? 效果图预览 插件JS accordionB.js ; (function ($, wind…
昨天写了个jQuery插件实例四:手风琴效果[无动画版]那个是没有动画效果的,且可配置性不高,本篇为有动画效果.对于一些数据做了动态的计算,以实现自适应. 欢迎大家入群相互交流,学习,新群初建,欢迎各位的光临 效果图预览 插件JS accordionB.js ; (function ($, window, document, undefined) { var defaults = { 'isajax': false, //是否从ajax加载数据 'isDom': true, //是否是DOM数据…
参照网上的资料及提供的jQuery插件实现图片幻灯效果. 1.页面前台代码: //头部引用 <head runat="server"><title></title><script type="text/javascript" src="scripts/jquery/jquery-1.10.2.min.js"></script><script type="text/java…
来源:GBin1.com 在线演示 JavaScript提供很多强有力的方案,解决动态列的网格布局(例如:Pinterest).这些方案很有效,但是,有时候,会造成网格的间隙或粗糙的边缘. Mason.js是一个jQuery插件,巧妙地填充了这些间隙. 当创建一个网格时候,插件就开始计算这些间隙,然后就使用预定义的元素或是在网格中复制的内容来填充这些间隙. 可以定义用于元素的大小,列/行的大小,断点的大小,或者布局是流动还是固定的. via 极客社区 来源:JQuery插件:动态列和无间隙网格布…
在工作中使用jQuery插件相信对于程序员来说非常普遍,在网络上也有很多优秀的插件可供大家使用,功能非常强大.在之前用过的一些插件中,有些太过追求功能的强大和可配置性,造成使用的复杂度上升.个人认为与其做一个大而全的插件,不如做一个有限通用性.小巧.方便的插件来得实用,在一个网页中进行这个网页要用的功能插件,而一个插件的几K或十几K大少对于服务器来说完全可以忽略.因此我总则了自己开发插件的一个原则,对于一个特定功能的插件: 插件原则:少配置,限通用性,方便快捷部署 从这篇开始,将会把自己写的插件…
很多公司的前端设计开发人员都是女孩子,而这些女孩子很多JavaScript技能都不是很好.而前端开发过程中,JavaScript技能又是必不可少的.所以,如果前端小MM正在为某个JavaScript效果发愁的时候,你潇洒的过去,然后对她说:“嗨,美女,用这个吧.这是我写的一个jQuery插件.”我想基本上你的人生大事就能很快解决. 先想好做个什么功能 这是第一步,也是很重要的一步,鉴于咱们都是刚学习写jQuery插件,所以,这个功能一定要简单一些.不要想一口就吃个胖子,咱也吃不了.咱还是捡个瘦的…
公司的项目http://www.umfun.com/,有个说说的页面(和腾讯QQ空间说说一样),里面有个发表图片功能,上传完图片,需要点击展开的效果. 当时手里面事情比较多(公司就我一个前端),忙不过来,就用插件来实现了,试了fancyBox.lightbox等jQuery插件.插件都满足不了项目各种奇怪的需求,但是时间有限,只能先凑合了.. 项目上线后,最近时间比较充足,我就想把写个插件封装一下.毕竟人家的插件比较臃肿,修改起来麻烦,同时免得以后又是各种修改,还是根据公司的项目需求写比较好..…
图片切换效果在很多网站上都能看到,是一种常见的广告/活动宣传方式,通常位于网页上端.这个插件是众多图片切换效果的形式中的一种,数据源可在前端配置,也可从后台通JSON格式传输数据,当然,数据格式是固定的. 这个插件的要点在于:1.定时执行的函数不是在插件闭包里:2.在布局上如何布局:3.什么时候执行动画,什么时候暂停动画,以及jQuery的动画操作. 在这里用到的动画函数有: 动画 1.stop() 方法停止当前正在运行的动画.    语法    $(selector).stop(stopAll…
    又到了年底,从圣诞节开始,可以发现各大网站的活动是越来越多,都变的银装素裹,本人由于业务需求也需要做这么一个效果,所以就通过google大神找了一下相关资源,结果就出现了N种雪花效果的方式.种类繁多,最后找到了本文看到的这种效果,原作者写的可以说已经满足了我的需求,但是为了符合更多的场景,又再原作者的基础上做了调整.       声明:本文核心代码归原作者@Ivan Lazarevic(https://github.com/kopipejst)所有,本人只增加了一些参数和效果      …
在网站开发过程中,有时我们需要验证用户输入的信息是否符合我们的要求,所以我们会对用户提交的数据进行验证.验证分两次进行,一次是在客户端,一次是在服务端.客户端的验证可以提升用户的体验. jquery验证插件有很多,实现的功能也基本相同.本文介绍的只是jquery验证插件中的一种jquery.validate 1.jquery.validate插件功能 简单实现客户端信息验证,过滤不符合要求的信息 2.jquery.validate官方地址 官方地址:http://jqueryvalidation…