`
m22543
  • 浏览: 14163 次
最近访客 更多访客>>
社区版块
存档分类
最新评论

基于Jquery的图片自动分组且自适应页面的缩略图展示特效

 
阅读更多

 

今天分享的是一款基于Jquery的图片自动分组且自适应页面的缩略图展示特效,通俗一点说就是JS相册,不过是用JQuery做的,相当不错!

This experimental jQuery plugin allows the automatic grouping of thumbnails using a pile effect. The thumbnails will group according to their shared data-pile attribute and once clicked, the pile will disperse and its thumbnails fly to their positions. The thumbnails can be slightly rotated or positioned with a delay.

这个实验性的JQuery插件允许自动分组缩略图使用桩特效。缩略图会根据他们共同的data-pile属性和一次点击,桩将分散和其缩略图飞到他们的立场。缩略图可以稍微转动或定位与延迟。

The grid itself is adaptive, meaning that if there is not enough horizontal space considering the width and the gutter of the items, the column count will decrease and the grid will re-order.

网格本身是自适应的,意思是如果没有足够的水平空间考虑宽度和排水沟的物品,列数将减少和网格将排序。

预览地址:http://www.sitejs.cn/download/jquery/yulan/Stapel/

下载地址:http://www.sitejs.cn/sitejs-15591-1.html

  • 大小: 32.4 KB
分享到:
评论

相关推荐

    jquery自适应分组缩略图.rar

    在网页设计中,视觉效果往往扮演着重要的角色,其中,分组缩略图是一种常见的展示方式,它可以清晰地将多个图片或者内容分组呈现,增强用户体验。jQuery作为一种轻量级、功能强大的JavaScript库,非常适合用于实现...

    css3+jquery自适应缩略图叠加点击图片展示特效

    本知识点主要关注"css3+jquery自适应缩略图叠加点击图片展示特效",这是一种常见的网页设计技术,适用于创建引人入胜的图像展示模块。 首先,CSS3(Cascading Style Sheets的第三版)是用于描述HTML或XML(包括如...

    JavaScript_JQuery_CSS_CSS_DIV漂亮的实例123个

    111. 站长推荐jQuery产品展示专用的图片幻灯+缩略图、左右控制按钮实例下载 112. 站长推荐一款非常精美的jQuery 1.4漂亮相册程序打包给大家 113. 站长素材推荐jQuery带箭头控制左右图片滚动效果 114. 第二款...

    图片分组切换jQuery缩略图.zip

    本项目"图片分组切换jQuery缩略图"正是基于这一理念,通过jQuery库实现了用户友好的图片浏览体验。以下将详细介绍该功能的核心知识点: 1. **jQuery库的使用**:jQuery是一个轻量级的JavaScript库,简化了DOM操作、...

    jQuery自适应窗口大小图片排列代码.zip

    3. **新闻和博客**:媒体网站可以使用这种布局来展示文章的缩略图,确保图片在不同分辨率下都有良好的视觉效果。 ### 扩展与优化 - **延迟加载**:为了提高页面加载速度,可以结合懒加载技术,只在图片进入视口时才...

    jquery自适应图片高度满屏焦点图.zip

    【jQuery自适应图片高度满屏焦点图】是一种常见的网页设计技术,主要应用于网站的首页或者产品展示区域,通过动态调整图片大小和位置,使图片在各种屏幕尺寸下都能填满整个浏览器视窗,从而实现视觉上的冲击力和良好...

    jQuery响应鼠标全屏相册,有缩略图和箭头控制.rar

    jQuery响应鼠标全屏相册,有缩略图和箭头控制,来自flickr美国官网,从源代码分析来看,使用了jQuery,加入了动感的鼠标响应特效,并且还引入了LightBox的部分效果,整体效果看上去就像一款相册。flickr不亏是世界...

    jQuery css3带缩略图的幻灯片切换特效.zip

    【jQuery css3带缩略图的幻灯片切换特效】是一种常见的网页动态展示技术,它结合了jQuery库的高效操作和CSS3的新特性,为用户提供了一种流畅且互动性强的图片展示方式。在这个项目中,主要涉及的知识点包括: 1. **...

    jQuery实现带缩略图的超经典全屏图片轮播动画特效源码.zip

    总的来说,"jQuery实现带缩略图的超经典全屏图片轮播动画特效源码.zip"是一个实用的前端资源,它可以帮助开发者快速构建具有专业视觉效果的图片展示模块,提升网站的整体质量。通过学习和应用这个源码,开发者可以...

    jquery 动态示例

    57. jQuery黑色动感Ajax无刷新动态分组图片效果代码 58. jquery黑色风格左右带箭头的图片浏览控制插件下载 59. jQuery鼠标滑动图片显示标题与简介的滑动动感特效代码 60. jQuery鼠标移上小图显示大缩略图功能 61...

    100多个JQuery效果示例(实例)div+css+javascrpit

    57. jQuery黑色动感Ajax无刷新动态分组图片效果代码 58. jquery黑色风格左右带箭头的图片浏览控制插件下载 59. jQuery鼠标滑动图片显示标题与简介的滑动动感特效代码 60. jQuery鼠标移上小图显示大缩略图功能 61...

    jQuery右侧缩略图幻灯片切换特效代码.zip

    《jQuery右侧缩略图幻灯片切换特效代码详解》 在网页设计中,动态效果的运用可以提升用户体验,其中幻灯片切换是最常见的一种。jQuery作为JavaScript的一个强大库,提供了丰富的功能来实现这一效果。本篇文章将深入...

    JavaScript_JQuery_CSS_DIV漂亮的实例

    57. jQuery黑色动感Ajax无刷新动态分组图片效果代码 58. jquery黑色风格左右带箭头的图片浏览控制插件下载 59. jQuery鼠标滑动图片显示标题与简介的滑动动感特效代码 60. jQuery鼠标移上小图显示大缩略图功能 61...

    jQuery门户网站带缩略图相册特效代码

    在这个"jQuery门户网站带缩略图相册特效代码"中,开发者利用jQuery的强大功能,创建了一个适用于门户网站的图片展示解决方案。该相册特效不仅提供了美观的用户体验,还具有实用的功能特性。 首先,这个相册特效的...

    jQuery带缩略图的新闻焦点图切换效果插件

    标题中的“jQuery带缩略图的新闻焦点图切换效果插件”是指一种使用JavaScript库jQuery实现的网页元素交互功能,特别适用于展示新闻或产品的焦点图片。这种插件通常包括一个主展示区,显示当前选中的大图,以及一排小...

    jQuery门户网站带缩略图相册.zip

    《jQuery门户网站带缩略图相册》是一款专为门户网站设计的高效、易用的图片展示解决方案,它基于JavaScript库jQuery构建,旨在提供一种简洁而功能丰富的图片浏览体验。这款相册代码具有高度自适应性,能够自动调整...

    JQuery&CSS;&CSS;+DIV实例大全.rar

    57.jQuery黑色动感Ajax无刷新动态分组图片效果代码 58.jquery黑色风格左右带箭头的图片浏览控制插件下载 59.jQuery鼠标滑动图片显示标题与简介的滑动动感特效代码 60.jQuery鼠标移上小图显示大缩略图功能 ...

    jquery仿flash图片轮播

    总结来说,jQuery仿Flash图片轮播是一种现代且兼容性良好的图片展示方式,结合缩略图功能可以提供更加互动和直观的用户体验。通过熟练掌握jQuery和基本的前端技术,你可以轻松创建出符合需求的图片轮播效果。

    jQuery自适应宽度跟高度相册特效代码

    这个"jQuery自适应宽度跟高度相册特效代码"是一个专门设计用于网页中的相册展示解决方案,它能够根据浏览器窗口的宽度和高度自动调整布局,以确保在不同设备和屏幕尺寸上都能提供良好的用户体验。 该代码实现的核心...

    html5圆形缩略图导航全屏图片切换特效.zip

    本资源“html5圆形缩略图导航全屏图片切换特效.zip”提供了一个使用HTML5和jQuery实现的全屏图片切换效果,特别适合用于网站的展示或作品集页面。 首先,HTML5作为下一代网页标记语言,引入了许多新的语义元素,如`...

Global site tag (gtag.js) - Google Analytics