imgCentering 是一款可以让图片在div居中和实现弹出层的图片jQuery插件，可在一组图片中查看前一张和后一张进行切换的图片相册查看效果，且具有不错的动画效果。 使用教程： 1、引用文件： <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> <script src="js/imgcentering.js"></script> 2、HTML代码结构： &l...
bxSlider 是一款免费的 jQuery Slider 的插件，它可以实现 内容和图片幻灯片滚动效果，支持响应式，自适应各种尺寸的屏幕，桌面和手机等各种设备都能完美适应。 bxSlider 详细功能 完全响应式：支持所有设备。 支持水平，垂直和淡入淡出等模式。 支持图片，视频和 HTML 内容等幻灯片。 内置支持触摸和滑动等高级操作。 使用 CSS transitions 来实现幻灯片动画（原生硬件加速）。 完整的回调 API 和接口。 ...
jqfancytransitions是一款易于使用的显示照片过渡效果的jQuery幻灯片插件，兼容Safari 2 +、Internet Explorer 6 +、Firefox 2 +、3 + 9 +谷歌浏览器等。 使用方法 调用插件js文件： <script src="js/jquery.js" type="text/javascript"></script> <script src="js/jqFancyTransitions.js" type="text/javascript"></script&g...
flickity是一款响应式、适用于移动设备触摸屏、可滑动显示的jQuery幻灯片插件。该幻灯片插件可以设置多种显示效果，可以自动播放，是一款移动优先的jQuery幻灯片插件。 安装方法：可以通过Bower或npm来安装： Bower: bower install flickity --save npm: npm install flickity --save 使用方法： 要使用该幻灯片插件首先要在页面中引入 flickity.pkgd.js 和 flickity.css 文件。 <link rel="stylesheet" h...
整合pjax的准备工作 检查你的网站是否引入1.7.0版本以上的jquery.js，如果没有请全局引入 //新浪CDN提速（或以下载到本地引入）： <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.9.0/jquery.js"></script> 1.7.0版本以上的才有pushState的封装。 开始整合Pjax： 1.下载pjax.js，百度网盘：http://pan.baidu.com/s/1dF9E1w9； ...
瀑布流已经是几乎过时的技术了，不过对于很多想要快速实现它的朋友而言，却绝非易事，因为即使我们已经有很多现成的代码，却发现在自己的开发环境中 无法快速得到自己想要的结果。就像我们现在要介绍的三大利器（masonry+imagesloaded+infinitescroll）即使它们是如此 有效，却在马上要使用的时候让我们拿着如烫手山芋班很难真正达到我们想要的效果。 下面，我们从其原理来讲解它们的使用，以帮助你更好的发挥它的功效。但为了快速实现，我们不讲解它们的全部内容。 1. 合理的HTML布局是问题的基本 <div id="container"&g...
版本： jQuery v1.2.3+ jQuery lightBox v0.5 下载jQuery.lightBox-0.5.zip 效果截图： 使用方法： 1、载入 CSS 文件 <link rel="stylesheet" type="text/css" href="jquery.lightbox-0.5.css"/> 2、载入 JavaScript 文件（根据自己的存放位置修改路径） <script src="jquery.js">&l...
jQuery Masonry是一个构建瀑布流布局的一个jQuery插件，通过它可以轻松使页面元素通过绝对定位实现瀑布流布局，以下是参数介绍： $('#wrapper').masonry({ singleMode: false, // 禁用测量每个浮动元素的宽度。 // 如果浮动元素具有相同的宽度，设置为true。 // 默认： false columnWidth: 240, // 1列网格的宽度，单位为像素（px）。 // 默认： 第一个浮动元素外宽度。 itemSelector: '.box:visible', // 附加选择器，...
jqthumb是一款实用的响应式按比例生成图片缩略图的jQuery插件。jqthumb可以按照用户设定的比例、尺寸、位置等属性来生成新的缩略图，该插件可以通过计算来在老浏览器上生成响应式效果。 ，在老的浏览器中它能够替代background-size属性。 jqthumb兼容性超强，可以工作在所有现代浏览器甚至是IE6+上，jQuery 1.3以上版本即可运行。它还可以在Zepto（通过zepto-data插件）v1.1.3+上运行。 这个jquery插件可以帮助我们按比例生成图片缩略图。大家可能知道在处理缩略图的时候使用 background-s...
所谓“图片的预加载”就是指：正常情况下，点击一张比较大的图片，那图片会像‘瀑布’一样慢慢载入到页面，而预加载的效果，就是点击后图片，先进行预加载 （此刻你可以设置一个简单的Loading等待样式），然后等图片加载完毕后，在一次性将图片显示出来，不会有‘瀑布状’的效果，提高用户体验。 插件简介 jQuery imgpreload插件允许你预载图像之前和/或之后DOM加载。 插件选项 以下是由图像预加载插件提供的选项，你可以在全局范围内改变或重写默认通过设置对象的imgpreload方法。 $.fn.imgpreload.defau...
五图并列，中间图片放大展示的jQuery图片滚动插件，点击产品图片，或者点击左右箭头，或者拖动顶部的滚动条，产品图片就会放大显示，并且可以左右滚动。产品图片下面即是产品的名称和简略的描述，有利于SEO。 使用方法： 1、在head引入下面的css代码： <style type="text/css"> *{margin:0;padding:0;list-style-type:none;} a,img{border:0;text-decoration:none;} body{font:12px/180% Arial, He...
jQuery-Rebox是一个简单的、轻量级的、响应和移动友好的jQuery 灯箱插件。 下载：https://github.com/trentrichardson/jQuery-Rebox 例子 单一的初始化 创建一个单一的lightbox,分别在每个图片： $('#gallery1 a').rebox(); 画廊初始化 创建一个画廊风格lightbox: $('#gallery2').rebox({ selector: 'a' }); 动态添加图片后的事实 在页面交互...