Ignore:
Timestamp:
2011/07/31 10:11:41 (13 years ago)
Author:
468
Message:

#1413 スマートフォン版FlickSliderの動作変更(liが1つの場合、ナビ非表示、スライド条件liのwidth40%に変更)対応

File:
1 edited

Legend:

Unmodified
Added
Removed

  • branches/version-2_11-dev/html/user_data/packages/sphone/js/jquery.flickslide.js

    r21074 r21078  
    1414function slidePager(){var currentPager=$('.slidePagerPointer.active');var nextID='#pager'+String(slideCount);currentPager.removeClass('active');$(nextID).addClass('active');switch(slideCount){case 0:$('.flickSlideBottom .bottomLeft').addClass('off');$('.flickSlideBottom .bottomRight').removeClass('off');break;case pagerMax:$('.flickSlideBottom .bottomRight').addClass('off');$('.flickSlideBottom .bottomLeft').removeClass('off');break;default:$('.flickSlideBottom .bottomLeft').removeClass('off');$('.flickSlideBottom .bottomRight').removeClass('off');break;}} 
    1515$.fn.slideButton=function(settings){var settings=$.extend({direction:'prev',widthSource:{}},settings);var self=$(this);self.click(function(){var slideUnitWidth=settings.widthSource.outerWidth();slideLock=1;clearTimeout(slideTimer);slideObj.get(0).style.webkitTransition='-webkit-transform 0.6s ease-out';if(settings.direction==='prev'){if(currentX==0){slideObj.get(0).style.webkitTransform='translate3d(0, 0, 0)';slideTimer=setTimeout(lotation,slideDuration);slideLock=0;}else{currentX=currentX+slideUnitWidth;slideObj.get(0).style.webkitTransform='translate3d('+currentX+'px, 0, 0)';slideCount--;slidePager();slideTimer=setTimeout(lotation,slideDuration);slideLock=0;}}else if(settings.direction==='next'){if(currentX===maxX){slideObj.get(0).style.webkitTransform='translate3d('+maxX+'px, 0, 0)';slideTimer=setTimeout(lotation,slideDuration);slideLock=0;}else{currentX=currentX-slideUnitWidth;slideObj.get(0).style.webkitTransform='translate3d('+currentX+'px, 0, 0)';slideCount++;slidePager();slideTimer=setTimeout(lotation,slideDuration);slideLock=0;}}});} 
    16 $.fn.touchDrag=function(settings){var settings=$.extend({slideDuration:4000},settings);slideObj=$(this);slideDuration=settings.slideDuration;slideObj.bind('touchstart',{type:'start'},touchHandler);slideObj.bind('touchmove',{type:'move'},touchHandler);slideObj.bind('touchend',{type:'end'},touchHandler);function touchHandler(e){var slideUnitWidth=slideObj.children('li.slideUnit').outerWidth();var touch=e.originalEvent.touches[0];if(e.type=="touchstart"){clearTimeout(slideTimer);startX=touch.pageX;startY=touch.pageY;startTime=(new Date()).getTime();}else if(e.type=="touchmove"){diffX=touch.pageX-startX;diffY=touch.pageY-startY;if(Math.abs(diffX)-Math.abs(diffY)>0){e.preventDefault();moveX=Number(currentX+diffX);slideObj.css('-webkit-transition','none');slideObj.get(0).style.webkitTransform='translate3d( '+moveX+'px, 0, 0)';}}else if(e.type=="touchend"){var endTime=(new Date()).getTime();var diffTime=endTime-startTime;if(diffTime<300){slideObj.get(0).style.webkitTransition='-webkit-transform 0.5s ease-out';}else{slideObj.get(0).style.webkitTransition='-webkit-transform 0.6s ease-out';} 
    17 if(diffX>150||(diffX>60&&diffTime<400&&orientationChangeDelay===0)){if(currentX==0){slideObj.get(0).style.webkitTransform='translate3d(0, 0, 0)';}else{currentX=currentX+slideUnitWidth;slideObj.get(0).style.webkitTransform='translate3d('+currentX+'px, 0, 0)';slideCount--;slidePager();}}else if(diffX<-150||(diffX<-60&&diffTime<400&&orientationChangeDelay===0)){if(currentX===maxX){slideObj.get(0).style.webkitTransform='translate3d('+maxX+'px, 0, 0)';}else{currentX=currentX-slideUnitWidth;slideObj.get(0).style.webkitTransform='translate3d('+currentX+'px, 0, 0)';slideCount++;slidePager();}}else{if(currentX===0){slideObj.get(0).style.webkitTransform='translate3d(0, 0, 0)';}else if(currentX===maxX){slideObj.get(0).style.webkitTransform='translate3d('+maxX+'px, 0, 0)';}else{slideObj.get(0).style.webkitTransform='translate3d('+currentX+'px, 0, 0)';}} 
     16$.fn.touchDrag=function(settings){var settings=$.extend({slideDuration:4000, targetWidth:150},settings);slideObj=$(this);slideDuration=settings.slideDuration;slideObj.bind('touchstart',{type:'start'},touchHandler);slideObj.bind('touchmove',{type:'move'},touchHandler);slideObj.bind('touchend',{type:'end'},touchHandler);function touchHandler(e){var slideUnitWidth=slideObj.children('li.slideUnit').outerWidth();var touch=e.originalEvent.touches[0];if(e.type=="touchstart"){clearTimeout(slideTimer);startX=touch.pageX;startY=touch.pageY;startTime=(new Date()).getTime();}else if(e.type=="touchmove"){diffX=touch.pageX-startX;diffY=touch.pageY-startY;if(Math.abs(diffX)-Math.abs(diffY)>0){e.preventDefault();moveX=Number(currentX+diffX);slideObj.css('-webkit-transition','none');slideObj.get(0).style.webkitTransform='translate3d( '+moveX+'px, 0, 0)';}}else if(e.type=="touchend"){var endTime=(new Date()).getTime();var diffTime=endTime-startTime;if(diffTime<300){slideObj.get(0).style.webkitTransition='-webkit-transform 0.5s ease-out';}else{slideObj.get(0).style.webkitTransition='-webkit-transform 0.6s ease-out';} 
     17if(diffX>settings.targetWidth||(diffX>60&&diffTime<400&&orientationChangeDelay===0)){if(currentX==0){slideObj.get(0).style.webkitTransform='translate3d(0, 0, 0)';}else{currentX=currentX+slideUnitWidth;slideObj.get(0).style.webkitTransform='translate3d('+currentX+'px, 0, 0)';slideCount--;slidePager();}}else if(diffX<(settings.targetWidth*-1)||(diffX<-60&&diffTime<400&&orientationChangeDelay===0)){if(currentX===maxX){slideObj.get(0).style.webkitTransform='translate3d('+maxX+'px, 0, 0)';}else{currentX=currentX-slideUnitWidth;slideObj.get(0).style.webkitTransform='translate3d('+currentX+'px, 0, 0)';slideCount++;slidePager();}}else{if(currentX===0){slideObj.get(0).style.webkitTransform='translate3d(0, 0, 0)';}else if(currentX===maxX){slideObj.get(0).style.webkitTransform='translate3d('+maxX+'px, 0, 0)';}else{slideObj.get(0).style.webkitTransform='translate3d('+currentX+'px, 0, 0)';}} 
    1818slideTimer=setTimeout(lotation,slideDuration);slideLock=0;}} 
    1919slideTimer=setTimeout(lotation,slideDuration);} 
    20 var settings=$.extend({target:'',colum:1,height:170,duration:4000,parentArea:''},settings);var contents=$(this);var contentsLength=contents.length;var wrap=$('<div class="flickSlideContainer"><div class="moveWrap"><ul class="move"></ul></div></div>');var slideMask=$('<div class="slideMask resizable"></div>');var bottom=$('<div class="flickSlideBottom"><div class="bottomLeft off">&lt;</div><ul class="slidePager"></ul><div class="bottomRight">&gt;</div></div>'); 
     20var settings=$.extend({target:'',colum:1,height:170,duration:4000,parentArea:''},settings);var contents=$(this);var targetWidth=contents.outerWidth();var contentsLength=contents.length;var wrap=$('<div class="flickSlideContainer"><div class="moveWrap"><ul class="move"></ul></div></div>');var slideMask=$('<div class="slideMask resizable"></div>');var bottom=$('<div class="flickSlideBottom"><div class="bottomLeft off">&lt;</div><ul class="slidePager"></ul><div class="bottomRight">&gt;</div></div>');var bottom2=$('<div class="flickSlideBottom"><div class="bottomLeft off"></div><ul class="slidePager"></ul><div class="bottomRight"></div></div>') 
    2121//$(this).contents().find('img').removeAttr('width').removeAttr('height').css({width:'100%',height:'auto'}); 
    2222var loop=Math.floor(contentsLength/settings.colum);loop=contentsLength%settings.colum>0?loop++:loop;pagerMax=loop-1;var contentsCount=0;for(var i=0;i<loop;i++){var unitElem=$('<li/>').addClass('slideUnit').addClass('resizable');var pager=$('<li id="pager'+i+'" class="slidePagerPointer"></li>');if(i===0){pager.addClass('active')} 
    … …  
    2424unitElem.append(itemElem);contentsCount++;} 
    2525wrap.contents().find('ul.move').append(unitElem);bottom.children('ul.slidePager').append(pager);} 
    26 //ƒXƒ‰ƒCƒhÅ‘啝‚ð•\Ž¦ƒGƒŠƒA‚̉¡•~li‚̐”¨li‚̉¡•~li‚̐”‚ɕύX 
    27 $(settings.target).after(wrap);$(settings.target).remove();bottom.children('.bottomLeft').slideButton({direction:'prev',widthSource:wrap.contents().find('li.slideUnit')});bottom.children('.bottomRight').slideButton({direction:'next',widthSource:wrap.contents().find('li.slideUnit')});wrap.contents().find('ul.move').touchDrag({duration:settings.duration});wrap.after(bottom);$(window).bind('load',function(){var styles=getComputedStyle($('.moveWrap').get(0));if(styles){$('.resizable').css('width',styles.width);$('.slideMask').css('height',$('.move').outerHeight()).css('width',styles.width-1);maxX=Number($(settings.parentArea + ' .flickSlideContainer li.slideUnit').length-1)*Number(getComputedStyle($(settings.parentArea + ' .flickSlideContainer li.slideUnit').get(0)).width.replace('px',''))*-1;} 
     26//スライド最大幅を表示エリアの横幅×liの数→liの横幅×liの数に変更 
     27$(settings.target).after(wrap);$(settings.target).remove();bottom.children('.bottomLeft').slideButton({direction:'prev',widthSource:wrap.contents().find('li.slideUnit')});bottom.children('.bottomRight').slideButton({direction:'next',widthSource:wrap.contents().find('li.slideUnit')});wrap.contents().find('ul.move').touchDrag({duration:settings.duration,targetWidth:(targetWidth*0.3)});if(contentsLength > 1) {wrap.after(bottom)} else {wrap.after(bottom2)};$(window).bind('load',function(){var styles=getComputedStyle($('.moveWrap').get(0));if(styles){$('.resizable').css('width',styles.width);$('.slideMask').css('height',$('.move').outerHeight()).css('width',styles.width-1);maxX=Number($(settings.parentArea + ' .flickSlideContainer li.slideUnit').length-1)*Number(getComputedStyle($(settings.parentArea + ' .flickSlideContainer li.slideUnit').get(0)).width.replace('px',''))*-1;} 
    2828var slideFirstChild=$('ul.move li:first').clone();$('ul.move').show();});}})(jQuery);var is={ie:navigator.appName=='Microsoft Internet Explorer',java:navigator.javaEnabled(),ns:navigator.appName=='Netscape',ua:navigator.userAgent.toLowerCase(),version:parseFloat(navigator.appVersion.substr(21))||parseFloat(navigator.appVersion),win:navigator.platform=='Win32'} 
    2929is.mac=is.ua.indexOf('mac')>=0;if(is.ua.indexOf('opera')>=0){is.ie=is.ns=false;is.opera=true;} 
Note: See TracChangeset for help on using the changeset viewer.