wowslider实现一个简洁幻灯片轮播图效果代码
代码语言:html
所属分类:幻灯片
代码描述:wowslider实现一个简洁幻灯片轮播图效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/wowslider.css"> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script> </head> <body style="background-color:#d7d7d7;margin:auto;padding:100px;"> <div id="wowslider-container1"> <div class="ws_images"> <ul> <li><img src="//repo.bfw.wiki/bfwrepo/image/5d65ea7d8bc8b.png" alt="1" title="1" id="wows1_0"></li> <li><img src="//repo.bfw.wiki/bfwrepo/image/5d65ea7d8bc8b.png" alt="2" title="2" id="wows1_1"></li> <li><a href=""><img src="data1/images/3.jpg" alt="bootstrap carousel" title="3" id="wows1_2"></a></li> <li><img src="//repo.bfw.wiki/bfwrepo/image/5d65ea7d8bc8b.png" alt="4" title="4" id="wows1_3"></li> </ul> </div> <div class="ws_bullets"> <div> <a href="#" title="1"><span><img src="//repo.bfw.wiki/bfwrepo/image/5d65ea7d8bc8b.png" alt="1">1</span></a> <a href="#" title="2"><span><img src="//repo.bfw.wiki/bfwrepo/image/5d65ea7d8bc8b.png" alt="2">2</span></a> <a href="#" title="3"><span><img src="//repo.bfw.wiki/bfwrepo/image/5d65ea7d8bc8b.png" alt="3">3</span></a> <a href="#" title="4"><span><img src="//repo.bfw.wiki/bfwrepo/image/5d65ea7d8bc8b.png" alt="4">4</span></a> </div> </div> <div class="ws_script" style="position:absolute;left:-99%"></div> <div class="ws_shadow"></div> </div> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/wowslider.js"></script> <script type="text/javascript"> // ----------------------------------------------------------------------------------- // http://wowslider.com/ // JavaScript Wow Slider is a free software that helps you easily generate delicious // slideshows with gorgeous transition effects, in a few clicks without writing a single line of code. // Generated by WOW Slider 8.6 // //*********************************************** // Obfuscated by Javascript Obfuscator // http://javascript-source.com //*********************************************** jQuery.extend(jQuery.easing, { easeInOutQuart: function(e, f, a, h, g) { if ((f /= g/2) < 1) { return h/2*f*f*f*f+a }return -h/2*((f -= 2)*f*f*f-2)+a }}); function ws_turn(d, a, b) { var f = jQuery; var h = f(this); var c = f("li", b); var e = f(".ws_list", b); var g = f("<div>").addClass("ws_effect ws_turn").css({ position: "absolute", top: 0, left: 0, width: "100%", height: "100%", overflow: "hidden", perspective: 500 }).appendTo(b); thi.........完整代码请登录后点击上方下载按钮下载查看
网友评论0