(function(window, $){ $(function(){ var bEffectSlide= { wrapper: $("#coverWrap") ,option: { animation: false ,design: ($("#coverList").length>0 ? $("#coverList").attr("class").replace("design","") : '00') ,debug: false ,duration: cover_duration ,interval: cover_interval ,length: $("#coverWrap img").length ,viewWidth: $("#coverArea").width() ,offset: $("#coverArea").outerWidth() ,resize: false ,defer: null ,easing: "easeOutCubic" } ,position: 0 //初期化処理 ,init: function(){ //動的に#coverWrapに設定されるのはwidth,height,margin-leftのみ if($("#coverList").length <= 0){ return false; } this.debug(this.option.viewWidth); this.debug(this.option.offset); if(1500 < this.option.viewWidth){ this.option.viewWidth = $(window).width(); } if(1500 < this.option.offset){ this.option.offset = $(window).width(); } //画像幅を表示エリア幅に設定 this.wrapper.find("a,img").width(this.option.viewWidth); //単一画像 or 複数毎でクラスを分ける、ナビの表示も切り替え if(this.option.length < 2){ this.wrapper.find(">a").addClass("cover-single").removeAttr("style"); $("#coverList").find(".nav, #coverLeft, #coverRight").css({display: 'none'}); }else{ this.wrapper.find(">a").addClass("cover-multi").removeAttr("style"); $("#coverList").find(".nav, #coverLeft, #coverRight").removeAttr("style"); } //横並びにする為、画像表示枠を表示幅*画像枚数に設定 this.wrapper.width(this.option.viewWidth*this.option.length); /* v1.6 */ h = parseInt($("#coverWrap-height").attr("h")); if ( h == 0) { h = "auto"; } else { h = h + "px"; } this.wrapper.height(h); // this.wrapper.height("auto"); /* v1.6 2014.07.04 */ /* this.debug(this.option.viewWidth); this.debug("length:"+this.option.length); */ //2枚以上の時はアニメーション開始 if(1 < this.option.length){ this.playAuto(); this.removeNaviEvent(this.option.design); this.addNaviEvent(this.option.design); } } //パラメータリセット ,reset: function(){ //this.wrapper = $("#coverWrap").removeAttr('style'); this.wrapper = $("#coverWrap"); this.option.animation = false; this.option.design = ($("#coverList").length>0 ? $("#coverList").attr("class").replace("design","") : '00'); this.option.duration = cover_duration; this.option.interval = cover_interval; this.option.length = $("#coverWrap img").length; this.option.viewWidth = $("#coverArea").width(); this.option.offset = $("#coverArea").outerWidth(); this.init(); $(window).off('resize', this.resizeHandler); $(window).on('resize', this.resizeHandler); } ,start: function(){ this.init(); $(window).off('resize', this.resizeHandler); $(window).on('resize', this.resizeHandler); window.bEffects = this; return this; } ,stop: function(){ clearTimeout(coverAutoID); coverAutoID = null; this.wrapper.stop(true).css({"margin-left": 0}); } ,playAuto: function(){ var _this = this; if(coverAutoID!=null){ this.stop(); } coverAutoID = setTimeout(function(){ _this.debug("playAuto::setTimeout();"); _this.showNext(); }, this.option.interval); } ,showNext: function(){ var _this = bEffectSlide; if(!_this.option.animation){ _this.option.animation = true; _this.wrapper.animate({"margin-left": -(_this.option.offset)}, {duration: _this.option.duration, easing: _this.option.easing, complete: function(){ _this.position++; if(_this.option.length <= _this.position){ _this.position = 0; } _this.wrapper.find(">a:eq(0)").appendTo(_this.wrapper); _this.wrapper.css({"margin-left": 0}); _this.setNavigation(_this.position); _this.option.animation = false; _this.playAuto(); _this.debug("showNext::complete();"); _this.debug("CURRENT="+_this.position); } }); } } ,showPrev: function(){ var _this = bEffectSlide; if(!_this.option.animation){ _this.option.animation = true; _this.wrapper.find(">a:last").prependTo(_this.wrapper); _this.wrapper.css({"margin-left": -(_this.option.offset)}); _this.wrapper.animate({"margin-left": 0}, {duration: _this.option.duration, easing: _this.option.easing, complete: function(){ _this.position--; if(_this.position < 0){ _this.position = (_this.option.length-1); } _this.option.animation = false; _this.setNavigation(_this.position); _this.playAuto(); _this.debug("CURRENT="+_this.position); } }); } } ,slideToPage: function(t){ var _this = bEffectSlide; if(!_this.option.animation){ clearTimeout(coverAutoID); //移動スライド数 var offset = t - this.position; //1ページ移動の時 if(Math.abs(offset) == 1){ if(offset == 1){ _this.showNext(); }else{ _this.showPrev(); } } //2ページ以上の時 else if(1 < Math.abs(offset) ){ _this.multiSlide(offset); } } } ,setPosition: function(p){ this.position = p; if(this.option.length <= this.position){ this.position = 0; } else if(this.position < 0){ this.position = (this.option.length-1); } } ,multiSlide: function(offset){ var _this = bEffectSlide; if(!_this.option.animation){ _this.option.animation = true; var obj = {x : 0} var dar = 0; var dar2 = -1; var promise = $.Animation(obj, {x: -(_this.option.offset)*Math.abs(offset)}, {duration: parseInt(_this.option.duration*Math.abs(offset)/1.4), easing: _this.option.easing}); promise.progress(function(anim, per, remaining){ var x = Math.abs(obj.x); if(0 < offset){ if(dar != parseInt(x / _this.option.offset)){ dar = parseInt(x / _this.option.offset); _this.wrapper.find(">a:eq(0)").appendTo(_this.wrapper); //ナビゲーションセット _this.setPosition(_this.position+1); _this.setNavigation(_this.position); } x = x - _this.option.offset*dar; _this.wrapper.css({"margin-left": -x}); }else if(offset < 0){ if(dar != parseInt(x / _this.option.offset)){ dar = parseInt(x / _this.option.offset); //ナビゲーションセット _this.setPosition(_this.position-1); _this.setNavigation(_this.position); } if(dar2 != parseInt(x / _this.option.offset) && parseInt(x / _this.option.offset) < Math.abs(offset)){ dar2 = parseInt(x / _this.option.offset); _this.wrapper.find(">a:last").prependTo(_this.wrapper); } x = x - _this.option.offset*dar -_this.option.offset; _this.wrapper.css({"margin-left": x}); } }) .done(function(anim){ _this.wrapper.css({"margin-left": 0}); _this.option.animation = false; _this.playAuto(); }); } } ,setNavigation: function(pos){ $(".nav li a").removeClass("active"); $(".nav li a:eq("+pos+")").addClass("active"); } ,addNaviEvent: function(ev){ var _this = bEffectSlide; if(ev == "02"){ //丸ボタン var nav = $(".nav>ol>li>a"); //ナビのwidthを設定 var navWidth = 0; nav.each(function(){ navWidth += $(this).outerWidth() + parseInt(j$(this).parent().css("marginRight").replace("px", ""))+1; }); $(".nav").width(navWidth) //位置調整 $(".nav").css({"margin-left": -((13*_this.option.length)/2)}); //インデックスをセット nav.each(function(idx){ $(this).data({index:idx}); }) //イベント設定 $(".nav>ol>li>a").on('click', _this.naviEventHandler); }else if(ev == "03"){ //アロー $("#coverLeft, #coverRight").css({display: 'block'}); $("#coverLeft").on("click", _this.prevEventHandler); $("#coverRight").on("click", _this.nextEventHandler); } } ,removeNaviEvent: function(ev){ var _this = this; if(ev == "02"){ $(".nav>ol>li>a").off('click'); }else if(ev == "03"){ $("#coverLeft").off("click"); $("#coverRight").off("click"); } } ,naviEventHandler: function(e){ var _this = bEffectSlide; _this.slideToPage($(this).data("index")); e.stopPropagation(); e.preventDefault(); } ,prevEventHandler: function(e){ var _this = bEffectSlide; _this.showPrev(); e.stopPropagation(); e.preventDefault(); } ,nextEventHandler: function(e){ var _this = bEffectSlide; _this.showNext(); e.stopPropagation(); e.preventDefault(); } //windowリサイズイベント ,resizeHandler: function(e){ //windowか判定(IE対策) if(e.target.location){ var _this = bEffectSlide; clearTimeout(coverAutoID); _this.reset(); } } ,debug: function(mes){ if(this.option.debug){ if($("#logger").length==0){ $("body").append("
"+mes+"
") }else{ $("#logger").append("