没有合适的资源?快使用搜索试试~ 我知道了~
先来介绍SaySlide 2.0支持自定义如下功能: 1、上下左右方向播放以及jQuery的fadeOut、slideUp、hide效果; 2、自动播放时间间隔和动画播放的的速度; 3、是否显示标题; 4、是否在新窗口打开链接; 5、是否显示底部半透明背景; 6、按钮在底部显示的位置(左中右); 7、按钮默认背景色; 8、按钮激活状态颜色; 9、设置标题文字的样式; 10、触发按钮的事件; 下面就是重点的代码,分享给大家供大家参考,具体代码如下 (function($){ $.fn.saySlide=function(options){ v
资源详情
资源评论
资源推荐
jQuery焦点图插件焦点图插件SaySlide
先来介绍SaySlide 2.0支持自定义如下功能:
1、上下左右方向播放以及jQuery的fadeOut、slideUp、hide效果;
2、自动播放时间间隔和动画播放的的速度;
3、是否显示标题;
4、是否在新窗口打开链接;
5、是否显示底部半透明背景;
6、按钮在底部显示的位置(左中右);
7、按钮默认背景色;
8、按钮激活状态颜色;
9、设置标题文字的样式;
10、触发按钮的事件;
下面就是重点的代码,分享给大家供大家参考,具体代码如下
(function($){
$.fn.saySlide=function(options){
var defaults={
autoTime:3000,//自动播放时间间隔
speed:500,//切换速度
autodir:'RL',//自动播放方向,LR左到右,RL右到左,TB上到下,BT下到上, jQuery自带的动画:jq.fadeOut , jq.slideUp , jq.hide
isTitle:false,//是否显示标题
isBlank:true,//是否在新窗口打开链接
isBottombg:true,//是否显示底部半透明背景,该设置只有在isTitle为false生效
defaultBg:"#999999",//定义底部按钮默认颜色
currentBg:"#ffffff",//定义底部按钮激活状态颜色
btnAlign:"center",//按钮左中右位置,left,center,right
fontSize:"14px"
};
var _this=$(this), len=_this.children().length, _thisChildren;
options.Width=_this.width() || 0;
options.Height=_this.height() || 0;
options.Imgs=options.ImgsO=_this.children();
options.nowImg=0;
options.isLink = $(options.Imgs[0]).attr("href") === undefined ? false : true; //根据第一张图片是否有href属性来判断是否给图片加上链接
var options=$.extend(defaults,options);
switch(options.autodir){
case "LR":options.pos="right";break;
case "RL":options.pos="left";break;
case "BT":options.pos="top";break;
case "TB":options.pos="bottom";break;
default:
if(/jq\./.test(options.autodir)){
options.jq=options.autodir.slice(3);
options.autodir="jq";
}else{
alert("autodir参数不正确");
}
}
var SaySlide=function(opt){
this.opt=opt;
}
SaySlide.prototype={
_init:function(){
this.BulkImgs();
this.AutoPlay();
this.PausePlay();
this.BtnClick();
},
BoxBtn:function(){
var me=this.opt, boxHtml='';
for(var i=0;i<len;i++){
var bg=i==0?me.currentBg:me.defaultBg;
boxHtml+='<i style="background-color:'+ bg +'" index="'+ i +'"></i>';
}
var textAlign=me.isTitle==true ? "right" : me.btnAlign;
boxHtml='<div class="saySlide-bottom-btn" style="text-align:'+ textAlign +'"><span>'+ boxHtml +'</span></div>';
return boxHtml;
},
BulkImgs:function(){
var me=this.opt, ImgsArr=new Array;
for(var i=0;i<len;i++){
if(me.isLink===true){
var link=$(me.Imgs[i]).attr({"width":me.Width,"height":me.Height}).attr("href");
weixin_38593823
- 粉丝: 8
- 资源: 894
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功
评论0