<script> $(document).ready(function(){ $("#slider").sudoSlider(); }); </script> <div id="slider" class="slider" > <ul> <li>Content</li> <li>Content</li> <li>Content</li> <li>Content</li> </ul> </div>
效果图:
<script> $(document).ready(function(){ $("#slider2").sudoSlider({ numeric:true, prevNext:false, startSlide: 2 }); }); </script> <div id="slider2" class="slider" > <ul> <li>Content</li> <li>Content</li> <li>Content</li> <li>Content</li> </ul> </div>
效果图:
<script> $(document).ready(function(){ $("#slider3").sudoSlider({ numeric: true, fade: true, prevNext: true, startSlide: 3, updateBefore: true, numericText:['slide1', 'slide2', 'third slide', 'number 4', 'last slide'] }); }); </script> <div id="slider3" class="slider" > <ul> <li>Content</li> <li>Content</li> <li>Content</li> <li>Content</li> </ul> </div>
效果图:
<script> var ajaximages = [ 'images/01.jpg', 'images/04.jpg', 'images/02.jpg', 'images/03.jpg', 'images/05.jpg' ]; var imagestext = [ 'Just another beautiful sunset', 'Behind another beautiful sunset', 'Mountains in the Alps', 'Road and mountains in the Alps', 'A goat in norway', ]; $("#slider17").sudoSlider({ fade:true, continuous:true, ajax: ajaximages, imgAjaxFunction: function(t){ $(this) .css("position","relative") .append('<div class="caption" >' + imagestext[t-1] + '</div>'); }, beforeAniFunc: function(t){ $(this).children('.caption').hide(); }, afterAniFunc: function(t){ $(this).children('.caption').slideDown(400); } }); </script> <div id="slider17" class="slider"></div> <style> .caption { position:absolute; bottom:0; left:0; width:700px; height:25px; text-align:center; color:black; background:white; background:transparent; background:rgba(255,255,255,0.7); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#a3ffffff,endColorstr=#a3ffffff); zoom: 1; } </style>
效果图:
更多特效请下载:jQuery sudoSlider插件
相关推荐
jQuery sudoSlider插件 jQuery sudoSlider插件网页特效.zip
jQuery sudoSlider插件是一款通过sudoslider插件可以实现图片幻灯展示,焦点图片切换,html幻灯片等各种效果。
jQuery打印插件jqprint,jquery.jqprint-0.3.js 下载,内包含使用示例,下载解压可直接在浏览器打开使用。 jQuery打印插件jqprint,jquery.jqprint-0.3.js 下载,内包含使用示例,下载解压可直接在浏览器打开使用。 ...
jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery....
实现焦点图片切换html幻灯片展示效果的jQuery插件sudoSlider.zip 实现焦点图片切换html幻灯片展示效果的jQuery插件sudoSlider.zip 实现焦点图片切换html幻灯片展示效果的jQuery插件sudoSlider.zip
jquery 插件jquery 插件jquery 插件jquery 插件
jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件
jQuery常用插件大全 jQuery 插件大全
jquery插件库大全(200个): jqueryQQ表情插件 jquery下拉菜单导航 jquery下拉菜单栏 jquery仿Windows系统选中图标效果 jquery仿京东商品详情页图片放大效果 jquery仿百度新闻焦点轮播 jquery分离布局模版 jquery...
jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件jquery 上传插件...
组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件组织架构图之JQuery插件...
jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件
jquery图表插件大全收集 jquery图表插件大全收集jquery图表插件大全收集jquery图表插件大全收集
jQuery grid view plugin - jQuery表格插件
jquery 上传 插件 upload jquery上传插件upload jquery 上传 插件 upload jquery上传插件upload jquery 上传 插件 upload jquery上传插件upload jquery 上传 插件 upload jquery上传插件upload jquery 上传 插件 ...
jquery 日期插件jquery 日期插件jquery 日期插件jquery 日期插件
基于jQuery的计算器插件,外观简洁和美观,计算器的功能也很强大。有兴趣的同学可以继续为这款计算器扩展功能,应该也不是难事。
jQuery sudoSlider插件是一款通过sudoslider插件可以实现图片幻灯展示,焦点图片切换,html幻灯片等各种效果。