1/* 2 * jQuery Short Slider v2.1 3 * Copyright 2015 pccinc.jp 4 * http://www.pccinc.jp/markup/jquery-short-slider/ 5 * Author: Chiba Takeshi 6 * Licensed under the MIT license. 7 */ 8 9(function($) { 10 $.fn.shortslider = function(options){ 11 12 var defaults = { 13 itemDisplay : '.itemDisplay', 14 style : 'carousel', // nomal, carousel, fade 15 movementSpeed : 500, 16 group : 1, 17 flick : true, 18 rand : false, 19 // thumbnails : false, 20 hoverStop : true, // Applicable only when the 'auto' is true. 21 speed : 3000, 22 auto : true, 23 indicator : true, 24 indicatorStyle : true, // Applicable only when the 'indicator' is true. 25 PrevNext : true, 26 PrevNextStyle : true // Applicable only when the 'PrevNext' is true. 27 }; 28 29 // thisã®ã¯ã©ã¹ããã³IDãåå¾ãåé·ãªã®ã§ãªããè¯ãæ¹æ³ãããã°ï½¥ï½¥ï½¥ 30 var thisClass; 31 thisID = this.attr('id') != null ? '#'+this.attr('id') : ''; 32 thisClass = this.attr('class') != null ? '.'+this.attr('class').replace(/ /g,'.') : ''; 33 thisSelector = thisID+thisClass; 34 // console.log('thisSelector == ' + thisSelector) 35 36 if (this.length === 0) { 37 return this; 38 } 39 40 if (this.length > 1) { 41 this.each(function() { 42 $(this).shortslider(options); 43 }); 44 return this; 45 } 46 47 var settings = $.extend(defaults, options); 48 49 var $wrap = this; 50 $wrap.children('ul').addClass('shortSliderUL').wrap('<div class="itemDisplay"></div>') 51 52 var sizer = $wrap.find(' li:first-child img:first').clone().prependTo($wrap.find(settings.itemDisplay)).css({zIndex:-10, visibility:'hidden', width:'100%', display:'block'}).addClass('sizer'); 53 if( sizer.length == 0){ 54 var dummyImage = '<img src="http://dummyimage.com/300x200/000/fff" style="z-index:-10;visibility:hidden;width:100%;display:block;" class="sizer">' 55 $wrap.find(settings.itemDisplay).prepend($(dummyImage)); 56 //$('body').append('<style type="text/css">'+ thisSelector + ' ul.shortSliderUL:after { content:"."; clear:both; height:0; visibility:hidden; overflow:hidden; display:block;}</style>'); 57 //$wrap.find(settings.itemDisplay).find('ul').append('<div style="clear:both;"></div>') 58 } 59 60 var itemW = $wrap.find(settings.itemDisplay).width(); 61 62 if( settings.style == 'carousel' ) { 63 var firstLeft = itemW; 64 } else { 65 var firstLeft = 0; 66 } 67 68 $(window).bind('resize load', function(){ 69 itemW = $wrap.find(settings.itemDisplay).width(); 70 // num=1; 71 change(); 72 $wrap.find('ul li').css({ width:itemW}) 73 if( settings.PrevNext == true ) { 74 //var itemH = $wrap.find(settings.itemDisplay).height(); 75 //var prevH = $wrap.find('.prev').height(); 76 //$('.prev, .next').css({ top:itemH/2 , marginTop:-prevH/2}); 77 } 78 var itemH =$wrap.find(settings.itemDisplay).height(); 79 if( sizer.length == 0){ 80 $wrap.find('ul.shortSliderUL li').css({ height:itemH}) 81 } 82 83 }) 84 85 86 $wrap.find('ul li').css({ width:itemW}) 87 $wrap.find('ul').css({ width:99999, left:-firstLeft, position:'absolute', top:0}); // 88 $wrap.find('ul li').css({ float:'left'}) 89 var length = $wrap.find('ul li').length; 90 $(settings.itemDisplay).css({ overflow:'hidden', position:'relative'}); // 91 92 if( settings.style == 'carousel' ) { 93 var firstItem = $wrap.find('ul li:first-child').clone(); 94 var lastItem = $wrap.find('ul li:last-child').clone(); 95 $wrap.find('ul').append(firstItem); 96 $wrap.find('ul').prepend(lastItem); 97 $wrap.find('ul li:first-child').addClass('lastItem'); 98 $wrap.find('ul li:last-child').addClass('firstItem'); 99 } 100 101 102 /* indicator */ 103 if( settings.indicator == true ) { 104 if( length>1){ 105 var $indicator = $('<div class="indicator"></div>').appendTo($wrap); 106 for(var i=0; i<length; i++){ 107 $indicator.append('<span>'+ parseInt(i+1) +'</span>'); 108 } 109 if( settings.indicatorStyle == true ) { 110 $('body').append('<style type="text/css">'+ thisSelector +' .indicator { text-align:center; text-align:center; width:100%; height: 0; position:relative; top:-30px;} '+ thisSelector +' .indicator span { display:inline-block; width:10px; height:10px; text-indent:-9999px; margin:5px; vertical-align:top; cursor:pointer; border-radius:50%;} '+ thisSelector +' .indicator span.current { }'); 111 } 112 } 113 } 114 115 /* PrevNext */ 116 if( settings.PrevNext == true ) { 117 if( length>1){ 118 $('<a class="prev" href="">prev</a><a class="next" href="">next</a>').appendTo($wrap.find(settings.itemDisplay)); 119 if( settings.PrevNextStyle == true ) { 120 var itemH = $wrap.find(settings.itemDisplay).height(); 121 $('body').append('<style type="text/css">'+ thisSelector +' { position:relative;} '+ thisSelector +' .prev { position:absolute; display:block; width:30px; height:30px; top:50%; margin-top:-15px; left:10px; text-indent:-9999px; border-radius:50%;} '+ thisSelector +' .next { position:absolute; display:block; width:30px; height:30px; top:50%; margin-top:-15px; right:10px; text-indent:-9999px; border-radius:50%;} '+ thisSelector +' .prev:after { } '+ thisSelector +' .next:after { }</style>'); 122 } 123 } 124 } 125 126 /* thumbnailæªæ¤è¨¼ 127 --------------------------------------------------------- 128 if( settings.thumbnails == true ) { 129 var $thumbnails = $('<div class="itemThumb"><ul></ul></div>').appendTo(this); 130 var img; 131 for(var i=0; i<length; i++){ 132 src = $wrap.find(' li:nth-child('+ parseInt(i+1) +')').find('img').attr('src'); 133 $('.itemThumb ul').append('<li><a href=""><img src="'+ src +'" alt=""></a></li>'); 134 } 135 }*/ 136 137 var left; 138 var num = 1; 139 140 if( settings.style == 'fade' ) { // fade 141 $wrap.find('ul li').css({position:'absolute', display:'none'}) 142 $wrap.find('.indicator span:first-child').addClass('current'); 143 $wrap.find('ul li:first-child').addClass('currentItem').fadeIn(500); 144 } else { //default 145 $wrap.find('.indicator span:first-child').addClass('current'); 146 if( settings.style == 'carousel' ) { 147 $wrap.find('ul li:nth-child(2)').addClass('currentItem'); 148 } else { 149 $wrap.find('ul li:first-child').addClass('currentItem'); 150 } 151 } 152 153 function change(){ 154 if( settings.style == 'fade' ) { // fade 155 var i = num-1 156 if(!$wrap.find('ul li').eq(i).hasClass('currentItem')){ 157 $wrap.find('ul li').removeClass('currentItem').fadeOut(500); 158 $wrap.find('ul li').eq(i).addClass('currentItem').fadeIn(500, function(){ 159 if( settings.flick == true ) { // flick 160 $wrap.find('ul li').not(':animated').css({ left: 0}); 161 } 162 } 163 ); 164 } 165 } else { 166 $wrap.find('ul li').removeClass('currentItem'); 167 168 if( settings.style == 'carousel' ) { 169 $wrap.find('ul li').eq(num).addClass('currentItem'); 170 left = num*itemW; 171 if( num!=1 || num!=length ) { 172 $wrap.find('ul').stop().animate({left:-left},settings.movementSpeed); 173 } 174 } else { 175 $wrap.find('ul li').eq(num-1).addClass('currentItem'); 176 left = num*itemW-itemW; 177 $wrap.find('ul').stop().animate({left:-left},settings.movementSpeed); 178 } 179 } 180 $wrap.find('.indicator span').removeClass('current') 181 $wrap.find('.indicator span').eq(num-1).addClass('current'); 182 }; 183 184 function loop(){ 185 if( settings.auto == true ) { 186 if( settings.rand == true ) { 187 var s = num 188 rand(s) 189 //console.log(num) 190 change(); 191 } else if(length>num){ 192 num++; 193 change(); 194 } else { 195 num=1; 196 if( settings.style == 'carousel' ) { 197 left = itemW*length+itemW; 198 $wrap.find('ul').stop().animate({left:-left},settings.movementSpeed, function(){ 199 $wrap.find('ul').stop().css({ left:-itemW}) 200 }); 201 $wrap.find('.indicator span').removeClass('current') 202 $wrap.find('.indicator span').eq(0).addClass('current'); 203 } else { 204 change(); 205 } 206 } 207 } 208 209 } 210 function rand(s) { 211 num = Math.round( Math.random()*length ); 212 //console.log('numã' + num + 'ã«å¤æ´'); 213 if(num == s){ rand(s); }; 214 if(num == 0){ rand(s); }; 215 } 216 var timer = setInterval(loop, settings.speed); 217 218 if( settings.hoverStop == true ){ // hoverStop 219 $wrap.find('ul').hover( function(){ 220 clearInterval(timer); 221 }, function(){ 222 timer = setInterval(loop, settings.speed); 223 }); 224 }; 225 226 $wrap.find('.indicator span').click( function(){ 227 clearInterval(timer); 228 229 var index = $wrap.find('.indicator span').index(this); 230 num = index+1 231 232 change(); 233 timer = setInterval(loop, settings.speed); 234 }); 235 236 $wrap.find('a.prev').click( function(){ 237 PrevNextDisabled(); 238 clearInterval(timer); 239 if(num==1){ 240 num=length;
241 // num == length ã®å ´å 242 if( settings.style == 'carousel' ) { 243 left = 0; 244 $wrap.find('ul').stop().animate({left:left},settings.movementSpeed, function(){ 245 $wrap.find('ul').stop().css({ left:-num*itemW}) 246 247 //change(); 248 }); 249 $wrap.find('.indicator span').removeClass('current') 250 $wrap.find('.indicator span').eq(length-1).addClass('current'); 251 } else { 252 change(); 253 } 254 } else { 255 num = num-1; 256 change(); 257 } 258 timer = setInterval(loop, settings.speed); 259 return false; 260 }); 261 262 $wrap.find('a.next').click( function(){ 263 PrevNextDisabled(); 264 clearInterval(timer); 265 if(num==length){ 266 num=1; 267 if( settings.style == 'carousel' ) { 268 left = itemW*length+itemW; 269 $wrap.find('ul').stop().animate({left:-left},settings.movementSpeed, function(){ 270 $wrap.find('ul').stop().css({ left:-itemW}) 271 }); 272 $wrap.find('.indicator span').removeClass('current') 273 $wrap.find('.indicator span').eq(0).addClass('current'); 274 } else { 275 change(); 276 } 277 } else { 278 num = num+1; 279 change(); 280 } 281 timer = setInterval(loop, settings.speed); 282 return false; 283 }); 284 function PrevNextDisabled(){ 285 var $PrevNextMask = $('<span class="prev" style=" top:50%; opacity:0;"></span><span class="next" style=" top:50%; opacity:0;"></span>').appendTo($wrap.find(settings.itemDisplay)); 286 setTimeout( function(){ 287 $PrevNextMask.remove(); 288 }, 400); 289 } 290 291 if( settings.flick == true ) { 292 flick(); 293 }; 294 295 function flick(){ // flick 296 var box = $wrap.find('ul')[0]; 297 var $target = $wrap.find('ul'); 298 box.addEventListener("touchstart", touchHandler, false); 299 box.addEventListener("touchmove", touchHandler, false); 300 box.addEventListener("touchend", touchHandler, false); 301 302 var firstX, firstY, thisX, thisY, moveX, moveY; 303 moveX == 1; 304 function touchHandler(e){ 305 //e.preventDefault(); 306 var touch = e.touches[0]; 307 308 if(e.type == "touchstart"){ 309 clearInterval(timer) 310 left = parseInt($target.css('left').replace( 'px', '')) 311 firstX = touch.pageX; 312 firstY = touch.pageY; 313 } 314 315 if(e.type == "touchmove"){ 316 thisX = touch.pageX; 317 thisY = touch.pageY; 318 moveX = thisX - firstX; 319 moveY = thisY - firstY; 320 321 moveRate = moveX / moveY; 322 323 /* è§åº¦ */ 324 if(moveRate > Math.tan(30 * Math.PI/180)) { 325 e.preventDefault(); 326 } 327 if( settings.style == 'fade' ) { // fade 328 $target.find('li.currentItem').css({ left: (moveX+left)/5}); 329 }else { 330 $target.css({ left: moveX+left}); 331 } 332 } 333 if(e.type == "touchend"){ 334 clearInterval(timer) 335 336 if(moveX<-50){ 337 num = num+1 338 } else if(moveX>50) { 339 num = num-1 340 } else { 341 if( settings.style == 'fade' ) { // fade 342 $target.find('li.currentItem').stop().animate({ left: 0},settings.movementSpeed); 343 } 344 $target.stop().animate({ left:left},settings.movementSpeed); 345 } 346 if(num>length){ 347 if( settings.style == 'fade' ) { // fade 348 $wrap.find('.indicator span').removeClass('current') 349 $wrap.find('.indicator span').eq(1).addClass('current'); 350 num = 1 351 change() 352 }else { 353 if( settings.style == 'carousel' ) { 354 $wrap.find('ul').stop().animate({left:-itemW*length-itemW},settings.movementSpeed, function(){ 355 //alert('') 356 $wrap.find('ul').stop().css({ left:-itemW}) 357 }); 358 $wrap.find('.indicator span').removeClass('current') 359 $wrap.find('.indicator span').eq(0).addClass('current'); 360 num = 1 361 } else { 362 $target.stop().animate({ left:left},settings.movementSpeed); 363 num = length 364 } 365 } 366 } else if(num<1){ 367 if( settings.style == 'fade' ) { // fade 368 $wrap.find('.indicator span').removeClass('current') 369 $wrap.find('.indicator span').eq(length-1).addClass('current'); 370 num = length; 371 change() 372 }else { 373 if( settings.style == 'carousel' ) { 374 $target.stop().animate({left:0},settings.movementSpeed, function(){ 375 $target.css({ left:-length*itemW}) 376 }); 377 $wrap.find('.indicator span').removeClass('current') 378 $wrap.find('.indicator span').eq(length-1).addClass('current'); 379 } else { 380 $target.stop().animate({ left:left},settings.movementSpeed); 381 } 382 } 383 384 if( settings.style == 'carousel' ) { 385 num = length 386 } else { 387 if( !settings.style == 'fade' ) { // fade 388 num = 1 389 } 390 } 391 } else { 392 change() 393 } 394 395 moveX=0 396 timer = setInterval(loop, settings.speed); 397 } 398 } 399 } 400 401 return(this); 402 }; 403})(jQuery);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.