当前位置:首页 > 资源分类 > jQuery资源下载

jQuery文档、视频、电子书、源码

本标签包含:12个资源
jQuery 相关笔记精选
网友NO.340146

jQuery图片前后对比插件beforeAfter用法示例【附demo源码下载】

本文实例讲述了jQuery图片前后对比插件beforeAfter用法。分享给大家供大家参考,具体如下: 今天分享一款 jquery 插件——图片前后对比(beforeAfter),效果如下: 使用方法: !DOCTYPE HTMLhtml lang="en"head meta charset="utf-8"/ title图片前后对比/title/headbody div class="beforeafter" img src="images/before.jpg" alt="before" height="420" width="748"/ img src="images/after.jpg" alt="after" height="420" width="748"/ /div/body/htmlscript type="text/javascript" src="js/jquery.min.js"/scriptscript type="text/javascript" src="js/jquery-ui-1.8.13.custom.min.js"/scriptscript type="text/javascript" src="js/jquery.beforeafter-1.4.js"/scriptscript type="text/javascript"$(function(){ $('.beforeafter').beforeAfter({ imagePath: 'images/' });});/script 参数说明(部分): showFullLinks:是否显示下面的链接,点击链接,将自动显示完整的前或后的图片,默认值:true imagePath:导航图片的路径(绝对路……

网友NO.666531

使用jquery实现的一个图片延迟加载插件(含图片延迟加载原理)

图片延迟加载也称懒加载,通常应用于图片比较多的网页,如果一个页面图片比较多,且页面高度或宽度有好几屏,页面初次加载时,只显示可视区域的图片,当页面滚动的时候,图片进入了可视区域再进行加载,这样可以显著的提高页面的加载速度,更少的图片并发请求数也可以减轻服务器的压力。如果用户仅仅在首屏停留,还可以节省流量。如果TAB中的图片较多,也同样可以应用于TAB中,当触发TAB时再进行图片的加载。 图片延迟加载的原理比较简单,先将图片的真实地址缓存在一个自定义的属性(lazy-src)中,而src地址使用一个1×1的全透明的占位图片来代替,当然占位图片也可以是其他的图片。 img src="images/placeholder.png" lazy-src="images/realimg.jpg" / 因为是使用javascript来加载图片,如果用户禁用了javascript,可以设置一个替代的方案。 img src="images/placeh……

网友NO.993247

jquery实现的蓝色二级导航条效果代码

本文实例讲述了jquery实现的蓝色二级导航条效果代码。分享给大家供大家参考。具体如下: 这是一款网站导航条效果代码,菜单最多可支持两级,适合较多类型的网站使用,不喜欢蓝色的可自己修改成其它颜色,整体效果不错,挺简单的网站导航。 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-blue-2level-nav-style-codes/ 具体代码如下: !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"headmeta http-equiv="Content-Type" content="text/html; charset=gb2312"titlecss+jquery打造二级横向菜单/titlestyle type="text/css" /#droplinebar {overflow: hidden;}.droplinebar ul{margin: 0;padding: 0;float: left;width: 100%;font: bold 14px Arial, Helvetica, sans-serif,微软雅黑;text-align:center;background: #006b96 url(images/blueactive.gif) center center r……

网友NO.813660

JQuery zClip插件实现复制页面内容到剪贴板

相信这个功能大家平时上网经常能碰到,以前也没怎么留意怎么实现的,直到项目中需要。 最终效果: 网上一搜一大堆,单纯使用js方法也不是没有,但是由于各浏览器的安全机制不同,不是跨浏览器的。去看了几个常用的网站,都是用的透明flash遮挡“复制到剪贴板”按钮,所以当你点击“复制到剪贴板”的时候,点击的其实是flash,然后把你需要复制的内容传入到了flash,然后在通过flash的复制功能把传入的内容复制到了剪贴板。 加载 JQuery库和zclip插件 script type="text/javascript" src="js/jquery-1.8.1.min.js"/script script src="js/jquery.zclip.min.js"/script 下面是一个小demo,主要是复制文本框中的链接到剪贴板。 HTML input type="text" value="www.jb51.net" id="link" span id="copyBtn"复制链接/span 然后加入 脚本 script $('#copyBtn').zclip({ path: "ZeroClipboard.swf", copy: function(){ return $('#link').val()……

网友NO.564339

jQuery简单入门示例之用户校验demo示例

本文实例讲述了jQuery简单入门示例之用户校验。分享给大家供大家参考,具体如下: jQuery在小编的世界中,也就是JavaScript和查询(Query),即是辅助JavaScript开发的库,百度百科对JQuery的介绍比较详细,小伙伴可以东东自己可耐的小爪子,上网进行搜索,说不定,有意外惊喜哦,今天这篇文章,小编简单的介绍一下JQuery的一些基本知识,然后小编在集合实例,讲解一下在具体的应用过程中,我们的JQuery又是如何在她的舞台熠熠生辉...... 通过JQuery的学习,我们可以学到哪些知识nie,比如我们会学会JQuery的API函数的使用,以及简单的实例的实现方法还有一些html、css、js的小知识,作为明星级的框架JQuery,都有谁在使用nie,比如我们熟悉的Goole、IBM、ORACLE、DELL、土豆等等,都在使用JQuery做前端的开发,我们的JQuery是不是很火爆。 介绍完了JQuery的一些基本知……

网友NO.728287

Jquery实现无缝向上循环滚动列表的特效

效果呈现 整个列表间隔设定的时间向上移动一个item的高度 html结构: div class="slide-title" spantitle1/span spantitle2/span spantitle3/span /div div class="slide-container"!--css设置时,注意高度是显示多少个item,如:item的高度是30px,显示3个,高度则是 3*30 = 90px -- ul class="slide-list js-slide-list" li class="odd"spanitem1/spanspanitem1/spanspanitem1/span/li li class="even"spanitem2/spanspanitem2/spanspanitem2/span/li li class="even"spanitem2/spanspanitem2/spanspanitem2/span/li /ul /div 实现思路: 获得js-slide-list下第一个li元素的高度,对它的height或marginTop进行一个从有到无的动画变化,代码如下: var doscroll = function(){ var $parent = $('.js-slide-list'); var $first = $parent.find('li:first'); var height = $first.height(); $first.animate({ height: 0 //或者改成: marginTop: -height + 'px' }, 500, function() {// 动画结束后,把它插到最后,形成无缝 $first.css('height', heig……

Copyright 2018-2020 www.xz577.com 码农之家

投诉 / 推广 / 赞助:QQ:520161757