|
html部分：<!doctype html><html lang="zh"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>焦点幻灯轮播大图js特效</title> <meta name="keywords" content="焦点幻灯轮播大图js特效" /> <meta name="description" content="焦点幻灯轮播大图js特效" /> <link rel="stylesheet" type="text/CSS" href="css/style.css"></head><body> <!-- <div class="container"> --> <div class="content" style="width:1000px;height:300px;margin:30px auto;overflow:hidden;"> <div id="slider"> <a href="#"><img src="img/demo1.jpg"/></a> <a href="#"><img src="img/demo2.jpg"/></a> <a href="#"><img src="img/demo3.jpg"/></a> <a href="#"><img src="img/demo4.jpg"/></a> <a href="#"><img src="img/demo5.jpg"/></a> <a href="#"><img src="img/demo6.jpg"/></a> </div> </div> <!-- </div> --> <script src="js/jquery-1.10.2.js"></script> <script>window.jQuery || document.write('<script src="js/jquery-1.11.0.min.js"><\/script>')</script> <script type="text/javascript" src="js/vmc.slider.full.min.js"></script> <script type="text/javascript"> $(function() { $('#slider').vmcSlider({ width: 1000, height: 300, grIDCol: 10, gridRow: 5, gridVertical: 20, gridHorizontal: 10, autoPlay: true, ascending: true, effects: [ 'fade', 'fadeLeft', 'fadeRight', 'fadeTop', 'fadeBottom', 'fadeTopLeft', 'fadeBottomRight', 'blindsLeft', 'blindsRight', 'blindsTop', 'blindsBottom', 'blindsTopLeft', 'blindsBottomRight', 'curtainLeft', 'curtainRight', 'interlaceLeft', 'interlaceRight', 'mosaic', 'bomb', 'fumes' ], ie6Tidy: false, random: false, duration: 2000, speed: 900 }); }); </script></body></html>CSS部分：h3{ text-align: center; color:#828282 }body{ background-color:#2D2D2D}.vui-slider { position:relative; overflow:hidden; background:#999;}.vui-slider .vui-items { overflow:hidden; width:100%; height:100%;}.vui-slider .vui-item { display:none; position:absolute; top:0; left:0; width:100%; height:100%;}.vui-slider .vui-item a,.vui-slider .vui-item img { display:block; padding:0; margin:0; border:none;}.vui-slider .vui-buttons { position:absolute; z-index:5; bottom:16px; left:50%; float:left; display:inline; filter:alpha(Opacity=80); -moz-opacity:0.8; opacity: 0.8;}.vui-slider .vui-button { float:left; display:inline; overflow:hidden; height:12px; width:12px; margin:0 10px; padding:0; border:none; border-radius:6px; background:#FFF; cursor:pointer;}.vui-slider .vui-button-cur { background-color:#C00;}.vui-slider .vui-transfer { display:none; position:absolute; top:0; left:0; width:100%; height:100%; |
|
42730
0
开发工具
站长平台
IDC服务商
注册交易
SEO及安全
开放平台
CDN及SSL
源码资源
自媒体平台
图片工具
小程序平台
投资理财
常用工具
友情链接
网络硬盘
