jQuery实现的图片墙淡入淡出展示效果_时代Java(NowJava.com) -JS/jQuery代码 -演示与下载 -时代Java

diagonalFade

is a jQuery plugin allowing you to easily specify direction, fade-in, fade-out, and a host of other options to a grouping of elements. All you have to do is import it, specify the container to which the group of items resides, and poof, you're off and away.

diagonalFade is great for inventory or anything with a large amount of items ordered in a grid. diagonalFade has been tested in all modern browser's with jQuery 1.3.2 — if you'd like to share any of your findings please don't hesitate to contribute on GitHub!

Download
Download the minified version (4kb)

Diagonal Fade Examples

Fixed Width



Don't be shy—view source!

Usage

$("#container").diagonalFade({
time: 100,
fadeDirection_x: 'left-right', // "left-right" || "right-left"
fadeDirection_y: 'top-bottom', // "top-bottom" || "bottom-top"
fade: 'out',                   // "in" || "out"
complete: null                 // callback function
} });

// or $("#container").diagonalFade(); — these are all optional params.

Example with <img>'s:
Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes Shoes
Example with <div>'s:
A
B
C
D
E
F
G
H
I
J
K
L
M
N
O
P
Q
R
S
T
U
V
W
X
Y
Z
0
1
2
3
4
5
6
7
8
9
By jonobr1 — only for jQuery. Images from Need Supply Co.

代码整理:时代Java(NowJava.com) 

转载请注明出处,此代码仅供学习交流,请勿用于商业用途。

下载代码说明
X关闭

jQuery实现的图片墙全屏淡入淡出切换展示效果

jQuery实现的图片墙淡入淡出展示效果,此效果非常适合用来制作产品照片墙,可以全屏淡入淡出切换一组新的图片,经测试效果震撼,喜欢的朋友可不要错过了哈,希望对大家学习有所帮助。