带幻灯片效果的全屏背景jQuery插件:Vegas2

  由此转载 

幻灯片动画参数

在插件的文档页可以查看自带的切换动画效果及即时预览(点击查看

带幻灯片效果的全屏背景jQuery插件:Vegas2

使用方法:

STEP 1: 嵌入CSS样式表和JS

把VEGAS的CSS、JS以及jQuery插件嵌入到<head>内。

<head>
<link rel="stylesheet" href="http://jaysalvat.github.io/vegas/releases/latest/vegas.min.css">
<script src="http://code.jquery.com/jquery.min.js"></script>
<script src="http://jaysalvat.github.io/vegas/releases/latest/vegas.js"></script>
</head>

STEP 2: JAVASCRIPT设置,添加背景图片

<body>
...
 HTML内容
...
<script>
$('#example, body').vegas({
 slides: [
 { src: '/img/slide1.jpg' },
 { src: '/img/slide2.jpg' },
 { src: '/img/slide3.jpg' },
 { src: '/img/slide4.jpg' }
 ]
});
</script>
</body>

另外建议看SETTING页面,查看更多插件的参数设置(点击查看

带幻灯片效果的全屏背景jQuery插件:Vegas2

插件就介绍到这里,如果在做全屏式的网页,可以使用这个背景插件,或许能给网页增加不少的气氛哦!


Vegas2 主页,可以由此下载