js面向对象组件开发参考1

xiaoxiao2021-02-28  66

;(function($){ var My=function(poster){ this.poster=poster; this.posterItemMain=poster.find("ul.post_list"); this.pre=poster.find(".pre"); this.nxt=poster.find(".next"); this.posterList=this.posterItemMain.find("li.post_list_item"); this.posterItemLi=this.posterList.eq(0); this.setting={ "width":1000,//幻灯片的宽度 "height":270,//幻灯片的高度 "posterWidth":640,//显示的第一张的宽度 "posterHeight":270,//显示的第一张的高度 "scale":0.9, "verticalAlign":"middle", "speed":300 }; $.extend(this.setting,this.getSetting()); }; My.prototype = { constructor:My, //设置剩余贞的位置关系 setPostPos:function(){ var sliceItem=this.posterItemLi.slice(1); sliceSize=sliceItem.size()/2; rightSlice=sliceItem.slice(0,sliceSize); alert(sliceSize); }, //设置基本的参数控制基本的宽高 setSettingValue:function(){ this.poster.css({ width: this.setting.width, height: this.setting.height }); this.posterItemMain.css({ //设置ul的宽高 width: this.setting.width, height: this.setting.height }); //计算上下按钮的宽度 var w = (this.setting.width - this.setting.posterWidth) / 2; var h = this.setting.height; this.pre.css({ width: w, height: h, zIndex: Math.ceil(this.posterList.size() / 2) }); this.nxt.css({ width: w, height: h, zIndex: Math.ceil(this.posterList.size() / 2) }); this.posterItemLi.css({ width: this.setting.posterWidth, height: this.setting.posterHeight, left: w, zIndex: Math.floor(this.posterList.size() / 2) }) }, //获取人工配置参数 getSetting:function () { var setting = this.poster.attr("data-setting"); if (setting && setting != "") { return $.parseJSON(setting); } else { return {}; } } }; My.init = function (posters) { var _this_ = this; posters.each(function () { new _this_($(this)); }) }; window["My"]=My; })(jQuery);
转载请注明原文地址: https://www.6miu.com/read-70833.html

最新回复(0)