1 2/* 3 * LayerSlider 4 * 5 * (c) 2011-2014 George Krupa, John Gera & Kreatura Media 6 * 7 * Plugin web: http://kreaturamedia.com/ 8 * licenses: http://codecanyon.net/licenses/ 9*/ 10 11 12 13function lsShowNotice(lsobj,issue,ver){ 14 15 var el; 16 17 if( typeof lsobj == 'string' ){ 18 el = jQuery('#'+lsobj); 19 }else if( typeof lsobj == 'object' ){ 20 el = lsobj; 21 } 22 23 var errorTitle, errorText; 24 25 switch(issue){ 26 case 'jquery': 27 errorTitle = 'multiple jQuery issue'; 28 errorText = 'It looks like that another plugin or your theme loads an extra copy of the jQuery library causing problems for LayerSlider to show your sliders. <strong>Please navigate on your WordPress admin area to the main page of LayerSlider and enable the "Put JS includes to body" option within the Troubleshooting & Advanced Settings box.</strong>'; 29 break; 30 case 'oldjquery': 31 errorTitle = 'old jQuery issue'; 32 errorText = 'It looks like you are using an old version ('+ver+') of the jQuery library. LayerSlider requires at least version 1.7.0 or newer. Please update jQuery to 1.10.x or higher. Important: Please do not use the jQuery Updater plugin on WordPress and do not update to 2.x version of jQuery because it is not compatible with older browsers like IE 7 & 8. <a href="http://support.kreaturamedia.com/faq/4/layerslider-for-wordpress/#group-13&entry-60">You can read more about updating jQuery by clicking here.</a>'; 33 break; 34 } 35 36 el.addClass('ls-error'); 37 el.append('<p class="ls-exclam">!</p>'); 38 el.append('<p class="ls-error-title">LayerSlider: '+errorTitle+'</p>'); 39 el.append('<p class="ls-error-text">'+errorText+'</p>'); 40} 41 42(function($) { 43 44 $.fn.layerSlider = function( options ){ 45 46 // IMPROVEMENT v4.1.0 Checking jQuery version 47 // IMPROVEMENT v4.1.3 Changed required version from 1.7.2 to 1.7.0 48 49 var reqVer = '1.7.0'; 50 var curVer = $.fn.jquery; 51 var el = $(this); 52 53 var checkVersions = function(v1,v2){ 54 55 var v1parts = v1.split('.'); 56 var v2parts = v2.split('.'); 57 58 for (var i = 0; i < v1parts.length; ++i) { 59 60 if (v2parts.length == i) { 61 return false; 62 } 63 64 if(parseInt(v1parts[i]) == parseInt(v2parts[i])){ 65 continue; 66 }else if (parseInt(v1parts[i]) > parseInt(v2parts[i])){ 67 return false; 68 }else{ 69 return true; 70 } 71 } 72 73 if (v1parts.length != v2parts.length) { 74 return true; 75 } 76 77 return true; 78 }; 79 80 if( !checkVersions('1.8.0',curVer) ){ 81 el.addClass('ls-norotate'); 82 } 83 84 // Initializing if jQuery version is greater than 1.7.0 85 86 if( !checkVersions(reqVer,curVer) ){ 87 lsShowNotice( el, 'oldjquery', curVer ); 88 }else{ 89 90 if( (typeof(options)).match('object|undefined') ){ 91 return this.each(function(i){ 92 new layerSlider(this, options); 93 }); 94 }else{ 95 if( options === 'data' ){ 96 var lsData = $(this).data('LayerSlider').g; 97 if( lsData ){ 98 return lsData; 99 } 100 101 // NEW FEATURES v5.2.0 option to get userInitData & defaultInitData 102 103 }else if( options === 'userInitData' ){ 104 var lsInitData = $(this).data('LayerSlider').o; 105 if( lsInitData ){ 106 return lsInitData; 107 } 108 }else if( options === 'defaultInitData' ){ 109 var lsInitData = $(this).data('LayerSlider').defaults; 110 if( lsInitData ){ 111 return lsInitData; 112 } 113 114 }else{ 115 return this.each(function(i){ 116 117 // Control functions: prev, next, start, stop & change 118 119 var lsData = $(this).data('LayerSlider'); 120 if( lsData ){ 121 if( !lsData.g.isAnimating && !lsData.g.isLoading ){ 122 if( typeof options == 'number' ){ 123 if( options > 0 && options < lsData.g.layersNum + 1 && options != lsData.g.curLayerIndex ){ 124 lsData.change(options); 125 } 126 }else{ 127 switch(options){ 128 case 'prev': 129 lsData.o.cbPrev(lsData.g); 130 lsData.prev('clicked'); 131 break; 132 case 'next': 133 lsData.o.cbNext(lsData.g); 134 lsData.next('clicked'); 135 break; 136 case 'start': 137 if( !lsData.g.autoSlideshow ){ 138 lsData.o.cbStart(lsData.g); 139 lsData.g.originalAutoSlideshow = true; 140 lsData.start(); 141 } 142 break; 143 } 144 } 145 } 146 // if( options === 'debug' ){ 147 // lsData.d.show(); 148 // } 149 if( options === 'redraw' ){ 150 lsData.resize(); 151 } 152 if( ( lsData.g.autoSlideshow || ( !lsData.g.autoSlideshow && lsData.g.originalAutoSlideshow ) ) && options == 'stop' ){ 153 lsData.o.cbStop(lsData.g); 154 lsData.g.originalAutoSlideshow = false;
155 lsData.g.curLayer.find('iframe[src*="youtube.com"], iframe[src*="youtu.be"], iframe[src*="player.vimeo"]').each(function(){ 156 157 // Clearing videoTimeouts 158 159 clearTimeout( $(this).data( 'videoTimer') ); 160 }); 161 162 lsData.stop(); 163 } 164 if( options == 'forceStop'){ 165 lsData.forcestop(); 166 } 167 } 168 }); 169 } 170 } 171 } 172 }; 173 174 // LayerSlider methods 175 176 var layerSlider = function(el, options) { 177 178 var ls = this; 179 ls.$el = $(el).addClass('ls-container'); 180 ls.$el.data('LayerSlider', ls); 181 182 ls.load = function(){ 183 184 // Setting options (user settings) and global (not modificable) parameters 185 186 ls.defaults = layerSlider.options; 187 ls.o = $.extend({},ls.defaults, options); 188 ls.g = $.extend({},layerSlider.global); 189 ls.lt = $.extend({},layerSlider.layerTransitions ); 190 ls.st = $.extend({},layerSlider.slideTransitions ); 191 192 ls.g.enableCSS3 = $(el).hasClass('ls-norotate') ? false : true; 193 194 // NEW FEATURE v5.2.0 saving original HTML Markup 195 196 ls.g.originalMarkup = $(el).html(); 197 198 if( ls.g.ie78 ){ 199 ls.o.lazyLoad = false; 200 } 201 202 // WP parameters 203 204 if( ls.o.autoPauseSlideshow === 'enabled' ){ 205 ls.o.autoPauseSlideshow = true; 206 } 207 if( ls.o.autoPauseSlideshow === 'disabled' ){ 208 ls.o.autoPauseSlideshow = false; 209 } 210 211 // If layerslider.transitions.js is loaded... 212 213 if( typeof layerSliderTransitions !== 'undefined' ){ 214 ls.t = $.extend({},layerSliderTransitions); 215 } 216 217 // If custom transitions are loaded... 218 219 if( typeof layerSliderCustomTransitions !== 'undefined' ){ 220 ls.ct = $.extend({},layerSliderCustomTransitions); 221 } 222 223 // NEW IMPROVEMENT v3.6 forbid to call the init code more than once on the same element 224 225 if( !ls.g.initialized ){ 226 227 ls.g.initialized = true; 228 229 // Added debug mode v3.5 230 231 // ls.debug(); 232 233 if( $('html').find('meta[content*="WordPress"]').length ){ 234 ls.g.wpVersion = $('html').find('meta[content*="WordPress"]').attr('content').split('WordPress')[1]; 235 } 236 237 if( $('html').find('script[src*="layerslider"]').length ){ 238 if( $('html').find('script[src*="layerslider"]').attr('src').indexOf('?') != -1 ){ 239 ls.g.lswpVersion = $('html').find('script[src*="layerslider"]').attr('src').split('?')[1].split('=')[1]; 240 } 241 } 242 243 // Debug mode controls 244 245 // ls.d.aT('LayerSlider controls'); 246 // ls.d.aU('<a href="#">prev</a> | <a href="#">next</a> | <a href="#">start</a> | <a href="#">stop</a> | <a href="#">force stop</a>'); 247 // ls.d.history.find('a').each(function(){ 248 // $(this).click(function(e){ 249 // e.preventDefault(); 250 // $(el).layerSlider($(this).text()); 251 // }); 252 // }); 253 254 // ls.d.aT('LayerSlider version information'); 255 // ls.d.aU('JS version: <strong>' + ls.g.version + '</strong>'); 256 // if(ls.g.lswpVersion){ 257 // ls.d.aL('WP version: <strong>' + ls.g.lswpVersion + '</strong>'); 258 // } 259 // if(ls.g.wpVersion){ 260 // ls.d.aL('WordPress version: <strong>' + ls.g.wpVersion + '</strong>'); 261 // } 262 263 // ls.d.aL('jQuery version: <strong>' + $().jquery + '</strong>'); 264 265 // if( $(el).attr('id') ){ 266 267 // ls.d.aT('LayerSlider container'); 268 // ls.d.aU('#'+$(el).attr('id')); 269 // } 270 271 // NEW LOAD METHOD v3.5 272 // FIXED v4.0 If the selected skin is already loaded, calling the ls.init() function immediately 273 274 if( !ls.o.skin || ls.o.skin == '' || !ls.o.skinsPath || ls.o.skinsPath == '' ){ 275 276 // ls.d.aT('Loading without skin. Possibilities: mistyped skin and / or skinsPath.'); 277 278 ls.init(); 279 }else{ 280 281 // ls.d.aT('Trying to load with skin: '+ls.o.skin, true); 282 283 // Applying skin 284 285 $(el).addClass('ls-'+ls.o.skin); 286 287 var skinStyle = ls.o.skinsPath+ls.o.skin+'/skin.css'; 288 289 cssContainer = $('head'); 290 291 if( !$('head').length ){ 292 cssContainer = $('body'); 293 } 294 295 if( $('link[href="'+skinStyle+'"]').length ){ 296 297 // ls.d.aU('Skin "'+ls.o.skin+'" is already loaded.'); 298 299 curSkin = $('link[href="'+skinStyle+'"]'); 300 301 if( !ls.g.loaded ){ 302 303 ls.g.loaded = true; 304 305 // IMPROVEMENT v4.5.0 Added delay because of caching bugs 306 307 ls.g.t1 = setTimeout(function(){ 308 ls.init(); 309 },150); 310 } 311 312 }else{ 313 if (document.createStyleSheet){ 314 document.createStyleSheet(skinStyle); 315 var curSkin = $('link[href="'+skinStyle+'"]'); 316 }else{ 317 var curSkin = $('<link rel="stylesheet" href="'+skinStyle+'" type="text/css" />').appendTo( cssContainer ); 318 } 319 } 320 321 // curSkin.load(); function for most of the browsers. 322 323 curSkin.load(function(){ 324 325 if( !ls.g.loaded ){ 326 327 // ls.d.aU('curSkin.load(); fired'); 328 329 ls.g.loaded = true; 330 331 // IMPROVEMENT v4.5.0 Added delay because of caching bugs 332 333 ls.g.t2 = setTimeout(function(){ 334 ls.init(); 335 },150); 336 } 337 }); 338 339 // $(window).load(); function for older webkit ( < v536 ). 340 341 $(window).load(function(){ 342 343 if( !ls.g.loaded ){ 344 345 // ls.d.aU('$(window).load(); fired'); 346 347 ls.g.loaded = true; 348 349 // IMPROVEMENT v4.5.0 Added delay because of caching bugs 350 351 ls.g.t3 = setTimeout(function(){ 352 ls.init(); 353 },150); 354 } 355 }); 356 357 // Fallback: if $(window).load();Â not fired in 2 secs after $(document).ready(), 358 // curSkin.load(); not fired at all or the name of the skin and / or the skinsPath 359 // mistyped, we must call the init function manually. 360 361 ls.g.t4 = setTimeout( function(){ 362 363 if( !ls.g.loaded ){ 364 365 // ls.d.aT('Fallback mode: Neither curSkin.load(); or $(window).load(); were fired'); 366 367 ls.g.loaded = true; 368 ls.init(); 369 } 370 }, 1000); 371 } 372 } 373 }; 374 375 ls.init = function(){ 376 377 // NEW FEATURE v5.5.0 Appending the slider element into the element specified in appendTo 378 379 $(el).prependTo( $( ls.o.appendTo ) ); 380 381 // IMPROVEMENT v4.0.1 Trying to add special ID to <body> or <html> (required to overwrite WordPresss global styles) 382 383 if( !$('html').attr('id') ){ 384 $('html').attr('id','ls-global'); 385 }else if( !$('body').attr('id') ){ 386 $('body').attr('id','ls-global'); 387 } 388 389 // NEW FEATURES v5.5.0 Hiding the slider on mobile devices, smaller resolutions 390 // or changing it to a static but responsive image 391 392 if( ls.g.isMobile() === true && ls.o.hideOnMobile === true ){ 393 $(el).addClass('ls-forcehide'); 394 $(el).closest('.ls-wp-fullwidth-container').addClass('ls-forcehide'); 395 } 396 397 var showHide = function(){ 398 399 if( ls.o.hideOnMobile === true && ls.g.isMobile() === true ){ 400 $(el).addClass('ls-forcehide'); 401 $(el).closest('.ls-wp-fullwidth-container').addClass('ls-forcehide'); 402 ls.o.autoStart = false;
403 }else{ 404 if( $(window).width() < ls.o.hideUnder || $(window).width() > ls.o.hideOver ){ 405 $(el).addClass('ls-forcehide'); 406 $(el).closest('.ls-wp-fullwidth-container').addClass('ls-forcehide'); 407 }else{ 408 $(el).removeClass('ls-forcehide'); 409 $(el).closest('.ls-wp-fullwidth-container').removeClass('ls-forcehide'); 410 } 411 } 412 }; 413 414 $(window).resize( function(){ 415 416 showHide(); 417 }); 418 419 showHide(); 420 421 // NEW FEATURE v1.7 making the slider responsive 422 423 ls.g.sliderWidth = function(){ 424 return $(el).width(); 425 } 426 427 ls.g.sliderHeight = function(){ 428 return $(el).height(); 429 } 430 431 // Compatibility mode v5.0.0 432 // .ls-layer -> .ls-slide 433 // .ls-s -> .ls-l 434 435 $(el).find('.ls-layer').removeClass('ls-layer').addClass('ls-slide'); 436 $(el).find('.ls-slide > *[class*="ls-s"]').each(function(){ 437 var oldDistanceNum = $(this).attr('class').split('ls-s')[1].split(' ')[0]; 438 $(this).removeClass('ls-s'+oldDistanceNum).addClass('ls-l'+oldDistanceNum); 439 }); 440 441 442 if( ls.o.firstLayer ){ 443 ls.o.firstSlide = ls.o.firstLayer; 444 } 445 if( ls.o.animateFirstLayer === false ){ 446 ls.o.animateFirstSlide = false; 447 } 448 449 // REPLACED FEATURE v2.0 If there is only ONE layer, instead of duplicating it, turning off slideshow and loops, hiding all controls, etc. 450 451 if( $(el).find('.ls-slide').length == 1 ){ 452 ls.o.autoStart = false;
453 ls.o.navPrevNext = false; 454 ls.o.navStartStop = false; 455 ls.o.navButtons = false; 456 ls.o.loops = 0; 457 ls.o.forceLoopNum = false; 458 ls.o.autoPauseSlideshow = true; 459 ls.o.firstSlide = 1; 460 ls.o.thumbnailNavigation = 'disabled'; 461 } 462 463 // IMPROVEMENT v5.2.0 the original width of a full width slider should be always 100% even if the user forgot to set that value 464 // BUGFIX v5.3.0 An additional check required (with the original improvement full-width sliders with "normal" responsiveness couldn't be created) 465 466 if( $(el).parent().hasClass('ls-wp-fullwidth-helper') && ls.o.responsiveUnder !== 0 ){ 467 $(el)[0].style.width = '100%'; 468 } 469 470 // NEW FEATURE v3.0 added "normal" responsive mode with image and font resizing 471 // NEW FEATURE v3.5 responsiveUnder 472 473 if( ls.o.width ){ 474 ls.g.sliderOriginalWidthRU = ls.g.sliderOriginalWidth = '' + ls.o.width; 475 }else{ 476 ls.g.sliderOriginalWidthRU = ls.g.sliderOriginalWidth = $(el)[0].style.width; 477 } 478 479 if( ls.o.height ){ 480 ls.g.sliderOriginalHeight = '' + ls.o.height; 481 }else{ 482 ls.g.sliderOriginalHeight = $(el)[0].style.height; 483 } 484 485 if( ls.g.sliderOriginalWidth.indexOf('%') == -1 && ls.g.sliderOriginalWidth.indexOf('px') == -1 ){ 486 ls.g.sliderOriginalWidth += 'px'; 487 } 488 489 if( ls.g.sliderOriginalHeight.indexOf('%') == -1 && ls.g.sliderOriginalHeight.indexOf('px') == -1 ){ 490 ls.g.sliderOriginalHeight += 'px'; 491 } 492 493 if( ls.o.responsive && ls.g.sliderOriginalWidth.indexOf('px') != -1 && ls.g.sliderOriginalHeight.indexOf('px') != -1 ){ 494 ls.g.responsiveMode = true; 495 }else{ 496 ls.g.responsiveMode = false; 497 } 498 499 // NEW FEATURE v5.5.0 We must overwrite some user settings if fullScreen mode is enabled 500 501 if( ls.o.fullScreen === true ){ 502 ls.o.responsiveUnder = 0; 503 ls.g.responsiveMode = true; 504 505 if( ls.g.sliderOriginalWidth.indexOf('%') != -1 ){ 506 ls.g.sliderOriginalWidth = parseInt( ls.g.sliderOriginalWidth) + 'px'; 507 } 508 509 if( ls.g.sliderOriginalHeight.indexOf('%') != -1 ){ 510 ls.g.sliderOriginalHeight = parseInt( ls.g.sliderOriginalHeight) + 'px'; 511 } 512 } 513 514 // IMPROVEMENT v3.0 preventing WordPress to wrap your sublayers in <code> or <p> elements 515 516 $(el).find('*[class*="ls-l"], *[class*="ls-bg"]').each(function(){ 517 if( !$(this).parent().hasClass('ls-slide') ){ 518 $(this).insertBefore( $(this).parent() ); 519 } 520 }); 521 522 $(el).find('.ls-slide').each(function(){ 523 $(this).children(':not([class*="ls-"])').each(function(){ 524 $(this).remove(); 525 }); 526 527 var hd = $('<div>').addClass('ls-gpuhack'); 528 if( $(this).find('.ls-bg').length ){ 529 hd.insertAfter( $(this).find('.ls-bg').eq('0') ); 530 }else{ 531 hd.prependTo( $(this) ); 532 } 533 }); 534 535 $(el).find('.ls-slide, *[class*="ls-l"]').each(function(){ 536 537 if( $(this).data('ls') || $(this).attr('rel') || $(this).attr('style') ){ 538 if( $(this).data('ls') ){ 539 var params = $(this).data('ls').toLowerCase().split(';'); 540 }else if( $(this).attr('rel') && $(this).attr('rel').indexOf(':') != -1 && $(this).attr('rel').indexOf(';') != -1 ){ 541 var params = $(this).attr('rel').toLowerCase().split(';'); 542 }else{ 543 var params = $(this).attr('style').toLowerCase().split(';'); 544 } 545 for(x=0;x<params.length;x++){ 546 param = params[x].split(':'); 547 548 if( param[0].indexOf('easing') != -1 ){ 549 param[1] = ls.ieEasing( param[1] ); 550 } 551 552 var p2 = ''; 553 if( param[2] ){ 554 p2 = ':'+$.trim(param[2]); 555 } 556 557 if( param[0] != ' ' && param[0] != '' ){ 558 $(this).data( $.trim(param[0]), $.trim(param[1]) + p2 ); 559 } 560 } 561 } 562 563 // NEW FEATURE v5.2.0 Starts the slider only if it is in the viewport 564 565 if( ls.o.startInViewport === true && ls.o.autoStart === true ){ 566 567 ls.o.autoStart = false;
568 ls.g.originalAutoStart = true; 569 } 570 571 // NEW FEATURE v1.7 and v3.0 making the slider responsive - we have to use style.left instead of jQuery's .css('left') function! 572 573 var sl = $(this); 574 575 sl.data( 'originalLeft', sl[0].style.left ); 576 sl.data( 'originalTop', sl[0].style.top ); 577 578 if( $(this).is('a') && $(this).children().length > 0 ){ 579 sl = $(this).children(); 580 } 581 582 var _w = sl.width(); 583 var _h = sl.height(); 584 585 if( sl[0].style.width && sl[0].style.width.indexOf('%') != -1 ){ 586 _w = sl[0].style.width; 587 } 588 if( sl[0].style.height && sl[0].style.height.indexOf('%') != -1 ){ 589 _h = sl[0].style.height; 590 } 591 592 sl.data( 'originalWidth', _w ); 593 sl.data( 'originalHeight', _h ); 594 595 sl.data( 'originalPaddingLeft', sl.css('padding-left') ); 596 sl.data( 'originalPaddingRight', sl.css('padding-right') ); 597 sl.data( 'originalPaddingTop', sl.css('padding-top') ); 598 sl.data( 'originalPaddingBottom', sl.css('padding-bottom') ); 599 600 // iOS fade bug when GPU acceleration is enabled #1 601 602 var _o = typeof parseFloat( sl.css('opacity') ) == 'number' ? Math.round( parseFloat( sl.css('opacity') ) * 100 ) / 100 : 1; 603 $(this).data( 'originalOpacity', _o ); 604 605 if( sl.css('border-left-width').indexOf('px') == -1 ){ 606 sl.data( 'originalBorderLeft', sl[0].style.borderLeftWidth ); 607 }else{ 608 sl.data( 'originalBorderLeft', sl.css('border-left-width') ); 609 } 610 if( sl.css('border-right-width').indexOf('px') == -1 ){ 611 sl.data( 'originalBorderRight', sl[0].style.borderRightWidth ); 612 }else{ 613 sl.data( 'originalBorderRight', sl.css('border-right-width') ); 614 } 615 if( sl.css('border-top-width').indexOf('px') == -1 ){ 616 sl.data( 'originalBorderTop', sl[0].style.borderTopWidth ); 617 }else{ 618 sl.data( 'originalBorderTop', sl.css('border-top-width') ); 619 } 620 if( sl.css('border-bottom-width').indexOf('px') == -1 ){ 621 sl.data( 'originalBorderBottom', sl[0].style.borderBottomWidth ); 622 }else{ 623 sl.data( 'originalBorderBottom', sl.css('border-bottom-width') ); 624 } 625 626 sl.data( 'originalFontSize', sl.css('font-size') ); 627 sl.data( 'originalLineHeight', sl.css('line-height') ); 628 }); 629 630 // CHANGED FEATURE v3.5 url- / deep linking layers 631 632 if( document.location.hash ){ 633 for( var dl = 0; dl < $(el).find('.ls-slide').length; dl++ ){ 634 if( $(el).find('.ls-slide').eq(dl).data('deeplink') == document.location.hash.split('#')[1] ){ 635 ls.o.firstSlide = dl+1; 636 } 637 } 638 } 639 640 // NEW FEATURE v2.0 linkTo 641 642 $(el).find('*[class*="ls-linkto-"]').each(function(){ 643 var lClasses = $(this).attr('class').split(' '); 644 for( var ll=0; ll<lClasses.length; ll++ ){ 645 if( lClasses[ll].indexOf('ls-linkto-') != -1 ){ 646 var linkTo = parseInt( lClasses[ll].split('ls-linkto-')[1] ); 647 $(this).css({ 648 cursor: 'pointer' 649 }).click(function(e){ 650 e.preventDefault(); 651 $(el).layerSlider( linkTo ); 652 }); 653 } 654 } 655 }); 656 657 // Setting variables 658 659 ls.g.layersNum = $(el).find('.ls-slide').length; 660 661 // NEW FEATURE v3.5 randomSlideshow 662 663 if( ls.o.randomSlideshow && ls.g.layersNum > 2 ){ 664 ls.o.firstSlide == 'random'; 665 ls.o.twoWaySlideshow = false; 666 }else{ 667 ls.o.randomSlideshow = false; 668 } 669 670 // NEW FEATURE v3.0 random firstSlide 671 672 if( ls.o.firstSlide == 'random' ){ 673 ls.o.firstSlide = Math.floor(Math.random() * ls.g.layersNum+1); 674 } 675 676 ls.o.fisrtSlide = ls.o.fisrtSlide < ls.g.layersNum + 1 ? ls.o.fisrtSlide : 1; 677 ls.o.fisrtSlide = ls.o.fisrtSlide < 1 ? 1 : ls.o.fisrtSlide; 678 679 // NEW FEATURE v2.0 loops 680 681 ls.g.nextLoop = 1; 682 683 if( ls.o.animateFirstSlide ){ 684 ls.g.nextLoop = 0; 685 } 686 687 // NEW FEATURE v2.0 videoPreview 688 // IMPROVEMENT v4.6.0 http / https support of embedded videos 689 690 var HTTP = document.location.href.indexOf('file:') === -1 ? '' : 'http:'; 691 692 // Youtube videos 693 694 $(el).find('iframe[src*="youtube.com"], iframe[src*="youtu.be"]').each(function(){ 695 696 // BUGFIX v4.1.0 Firefox embedded video fix 697 698 $(this).parent().addClass('ls-video-layer'); 699 700 if( $(this).parent('[class*="ls-l"]') ){ 701 702 var iframe = $(this); 703 var http = HTTP; 704 705 // Getting thumbnail 706 707 $.getJSON( http + '//gdata.youtube.com/feeds/api/videos/' + $(this).attr('src').split('embed/')[1].split('?')[0] + '?v=2&alt=json&callback=?', function(data) { 708 709 iframe.data( 'videoDuration', parseInt(data['entry']['media$group']['yt$duration']['seconds']) * 1000 ); 710 }); 711
712 var vpContainer = $('<div>').addClass('ls-vpcontainer').appendTo( $(this).parent() ); 713 714// if( ls.o.lazyLoad ){ 715// $('<img>').appendTo( vpContainer ).addClass('ls-videopreview').attr('alt', 'Play video').data('src', http + '//img.youtube.com/vi/' + $(this).attr('src').split('embed/')[1].split('?')[0] + '/' + ls.o.youtubePreview ); 716// }else{ 717 $('<img>').appendTo( vpContainer ).addClass('ls-videopreview').attr('alt', 'Play video').attr('src', http + '//img.youtube.com/vi/' + $(this).attr('src').split('embed/')[1].split('?')[0] + '/' + ls.o.youtubePreview ); 718// } 719 $('<div>').appendTo( vpContainer ).addClass('ls-playvideo'); 720 721 $(this).parent().css({ 722 width : $(this).width(), 723 height : $(this).height() 724 }).click(function(){ 725 726 // IMPROVEMENT v5.2.0 if video playing is in progress, video layers with auto play will skip showuntil feature 727 728 if( $(this).data('showuntil') > 0 && $(this).data('showUntilTimer') ){ 729 clearTimeout( $(this).data('showUntilTimer') ); 730 } 731 732 ls.g.isAnimating = true; 733 734 if( ls.g.paused ){ 735 if( ls.o.autoPauseSlideshow != false ){ 736 ls.g.paused = false; 737 } 738 ls.g.originalAutoSlideshow = true; 739 }else{ 740 ls.g.originalAutoSlideshow = ls.g.autoSlideshow; 741 } 742 743 if( ls.o.autoPauseSlideshow != false ){ 744 ls.stop(); 745 } 746 747 ls.g.pausedByVideo = true; 748 749 http = $(this).find('iframe').data('videoSrc').indexOf('http') === -1 ? HTTP : ''; 750 751 $(this).find('iframe').attr('src', http + $(this).find('iframe').data('videoSrc') ); 752 $(this).find('.ls-vpcontainer').delay(ls.g.v.d).fadeOut(ls.g.v.fo, function(){ 753 if( ls.o.autoPauseSlideshow == 'auto' && ls.g.originalAutoSlideshow == true ){ 754 var videoTimer = setTimeout(function() { 755 ls.start(); 756 }, iframe.data( 'videoDuration') - ls.g.v.d ); 757 iframe.data( 'videoTimer', videoTimer ); 758 } 759 ls.g.isAnimating = false; 760 if( ls.g.resize == true ){ 761 ls.makeResponsive( ls.g.curLayer, function(){ 762 ls.g.resize = false; 763 }); 764 } 765 }); 766 }); 767 768 var sep = '&'; 769 770 if( $(this).attr('src').indexOf('?') == -1 ){ 771 sep = '?'; 772 } 773 774 // BUGFIX v5.1.0 Fixed several issues with embedded videos (mostly under Firefox and IE) 775 // fixed 'only audio but no video' bug, fixed 'unclickable video controls' bug, fixed 'hidden slider controls' bug 776 777 var videoFix = '&wmode=opaque&html5=1'; 778 779 // BUGFIX v5.1.0 Fixed autoplay parameter 780 781 if( $(this).attr('src').indexOf('autoplay') == -1 ){ 782 $(this).data( 'videoSrc', $(this).attr('src') + sep + 'autoplay=1' + videoFix ); 783 }else{ 784 $(this).data( 'videoSrc', $(this).attr('src').replace('autoplay=0','autoplay=1') + videoFix ); 785 } 786 787 $(this).data( 'originalWidth', $(this).attr('width') ); 788 $(this).data( 'originalHeight', $(this).attr('height') ); 789 $(this).attr('src',''); 790 } 791 }); 792 793 // Vimeo videos 794 795 $(el).find('iframe[src*="player.vimeo"]').each(function(){ 796 797 // BUGFIX v4.1.0 Firefox embedded video fix 798 799 $(this).parent().addClass('ls-video-layer'); 800 801 if( $(this).parent('[class*="ls-l"]') ){ 802 803 var iframe = $(this); 804 var http = HTTP; 805 806 // Getting thumbnail 807
808 var vpContainer = $('<div>').addClass('ls-vpcontainer').appendTo( $(this).parent() ); 809 810 $.getJSON( http + '//vimeo.com/api/v2/video/'+ ( $(this).attr('src').split('video/')[1].split('?')[0] ) +'.json?callback=?', function(data){ 811 812// if( ls.o.lazyLoad ){ 813// $('<img>').appendTo( vpContainer ).addClass('ls-videopreview').attr('alt', 'Play video').data('src', data[0]['thumbnail_large'] ); 814// }else{ 815 $('<img>').appendTo( vpContainer ).addClass('ls-videopreview').attr('alt', 'Play video').attr('src', data[0]['thumbnail_large'] ); 816// } 817 iframe.data( 'videoDuration', parseInt( data[0]['duration'] ) * 1000 ); 818 $('<div>').appendTo( vpContainer ).addClass('ls-playvideo'); 819 }); 820 821 822 $(this).parent().css({ 823 width : $(this).width(), 824 height : $(this).height() 825 }).click(function(){ 826 827 // IMPROVEMENT v5.2.0 if video playing is in progress, video layers with auto play will skip showuntil feature 828 829 if( $(this).data('showuntil') > 0 && $(this).data('showUntilTimer') ){ 830 clearTimeout( $(this).data('showUntilTimer') ); 831 } 832 833 ls.g.isAnimating = true; 834 835 if( ls.g.paused ){ 836 if( ls.o.autoPauseSlideshow != false ){ 837 ls.g.paused = false; 838 } 839 ls.g.originalAutoSlideshow = true; 840 }else{ 841 ls.g.originalAutoSlideshow = ls.g.autoSlideshow; 842 } 843 844 if( ls.o.autoPauseSlideshow != false ){ 845 ls.stop(); 846 } 847 848 ls.g.pausedByVideo = true; 849 850 http = $(this).find('iframe').data('videoSrc').indexOf('http') === -1 ? HTTP : ''; 851 852 $(this).find('iframe').attr('src', http + $(this).find('iframe').data('videoSrc') ); 853 $(this).find('.ls-vpcontainer').delay(ls.g.v.d).fadeOut(ls.g.v.fo, function(){ 854 if( ls.o.autoPauseSlideshow == 'auto' && ls.g.originalAutoSlideshow == true ){ 855 var videoTimer = setTimeout(function() { 856 ls.start(); 857 }, iframe.data( 'videoDuration') - ls.g.v.d ); 858 iframe.data( 'videoTimer', videoTimer ); 859 } 860 ls.g.isAnimating = false; 861 if( ls.g.resize == true ){ 862 ls.makeResponsive( ls.g.curLayer, function(){ 863 ls.g.resize = false; 864 }); 865 } 866 }); 867 }); 868 869 var sep = '&'; 870 871 if( $(this).attr('src').indexOf('?') == -1 ){ 872 sep = '?'; 873 } 874 875 // BUGFIX v5.1.0 Fixed several issues with embedded videos (mostly under Firefox and IE) 876 // fixed 'only audio but no video' bug, fixed 'unclickable video controls' bug, fixed 'hidden slider controls' bug 877 878 var videoFix = '&wmode=opaque';
879 880 // BUGFIX v5.1.0 Fixed autoplay parameter 881 882 if( $(this).attr('src').indexOf('autoplay') == -1 ){ 883 $(this).data( 'videoSrc', $(this).attr('src') + sep + 'autoplay=1' + videoFix ); 884 }else{ 885 $(this).data( 'videoSrc', $(this).attr('src').replace('autoplay=0','autoplay=1') + videoFix ); 886 } 887 888 $(this).data( 'originalWidth', $(this).attr('width') ); 889 $(this).data( 'originalHeight', $(this).attr('height') ); 890 $(this).attr('src',''); 891 } 892 }); 893 894 // NEW FEATURE v5.0.0 HTML5 Video Support 895 896 $(el).find('video, audio').each(function(){ 897 898 // BUGFIX v5.1.0 fixed HTML5 video sizing issue (again :) 899 900 var ow = typeof $(this).attr('width') !== 'undefined' ? $(this).attr('width') : '640'; 901 var oh = typeof $(this).attr('height') !== 'undefined' ? $(this).attr('height') : '' + $(this).height(); 902 903 if( ow.indexOf('%') === -1 ){ 904 ow = parseInt( ow ); 905 } 906 907 if( oh.indexOf('%') === -1 ){ 908 oh = parseInt( oh ); 909 } 910 911 if( ow === '100%' && ( oh === 0 || oh === '0' || oh === '100%' ) ){ 912 $(this).attr('height', '100%'); 913 oh = 'auto'; 914 } 915 916 $(this).parent().addClass('ls-video-layer').css({ 917 width : ow, 918 height : oh 919 }).data({ 920 originalWidth : ow, 921 originalHeight : oh 922 }); 923 924 var curVideo = $(this); 925 926 // BUGFIX v5.3.0 'ended' function removed from 'click' function due to multiply 927 928 $(this).on('ended', function(){ 929 if( ls.o.autoPauseSlideshow === 'auto' && ls.g.originalAutoSlideshow === true ){ 930 ls.start(); 931 } 932 }); 933 934 $(this).removeAttr('width').removeAttr('height').css({ 935 width : '100%', 936 height : '100%' 937 }).click(function(e){ 938 939 // BUGFIX v5.3.0 autoplay didn't work in all cases 940 941 if( !ls.g.pausedByVideo ){ 942 943 if( this.paused ){ 944 e.preventDefault(); 945 } 946 947 this.play(); 948 949 ls.g.isAnimating = true; 950 951 if( ls.g.paused ){ 952 if( ls.o.autoPauseSlideshow !== false ){ 953 ls.g.paused = false; 954 } 955 ls.g.originalAutoSlideshow = true; 956 }else{ 957 ls.g.originalAutoSlideshow = ls.g.autoSlideshow; 958 } 959 960 if( ls.o.autoPauseSlideshow !== false ){ 961 ls.stop(); 962 } 963 964 ls.g.pausedByVideo = true; 965 ls.g.isAnimating = false; 966 967 if( ls.g.resize === true ){ 968 ls.makeResponsive( ls.g.curLayer, function(){ 969 ls.g.resize = false; 970 }); 971 } 972 } 973 }); 974 }); 975 976 // NEW FEATURE v1.7 animating first layer 977 978 if( ls.o.animateFirstSlide ){ 979 ls.o.firstSlide = ls.o.firstSlide - 1 === 0 ? ls.g.layersNum : ls.o.firstSlide-1; 980 } 981 982 ls.g.curLayerIndex = ls.o.firstSlide; 983 ls.g.curLayer = $(el).find('.ls-slide:eq('+(ls.g.curLayerIndex-1)+')'); 984 985 // Moving all layers to .ls-inner container 986 987 $(el).find('.ls-slide').wrapAll('<div class="ls-inner"></div>'); 988 989 // NEW FEATURE v4.5.0 Timers 990 991 if( ls.o.showBarTimer ){ 992 ls.g.barTimer = $('<div>').addClass('ls-bar-timer').appendTo( $(el).find('.ls-inner') ); 993 } 994 995 if( ls.o.showCircleTimer && !ls.g.ie78 ){ 996 ls.g.circleTimer = $('<div>').addClass('ls-circle-timer').appendTo( $(el).find('.ls-inner') ); 997 ls.g.circleTimer.append( $('<div class="ls-ct-left"><div class="ls-ct-rotate"><div class="ls-ct-hider"><div class="ls-ct-half"></div></div></div></div><div class="ls-ct-right"><div class="ls-ct-rotate"><div class="ls-ct-hider"><div class="ls-ct-half"></div></div></div></div><div class="ls-ct-center"></div>') ); 998 } 999 1000 // NEW FEATURE v4.0 Adding loading indicator into the element 1001 1002 ls.g.li = $('<div>').css({ 1003 zIndex: -1, 1004 display: 'none' 1005 }).addClass('ls-loading-container').appendTo( $(el) ); 1006 1007 $('<div>').addClass('ls-loading-indicator').appendTo( ls.g.li ); 1008 1009 // Adding styles 1010 1011 if( $(el).css('position') == 'static' ){ 1012 $(el).css('position','relative'); 1013 } 1014 1015 // IMPROVEMENT & BUGFIX v4.6.0 Fixed transparent global background issue under IE7 & IE8 1016 1017 if( ls.o.globalBGImage ){ 1018 $(el).find('.ls-inner').css({ 1019 backgroundImage : 'url('+ls.o.globalBGImage+')' 1020 }); 1021 }else{ 1022 $(el).find('.ls-inner').css({ 1023 backgroundColor : ls.o.globalBGColor 1024 }); 1025 } 1026 1027 if( ls.o.globalBGColor == 'transparent' && ls.o.globalBGImage == false ){ 1028 $(el).find('.ls-inner').css({ 1029 background : 'none transparent !important' 1030 }); 1031 } 1032 1033 // NEW FEATURES v5.0.0 Lazy-load & remove unnecessary width & height attributes from images 1034 1035 $(el).find('.ls-slide img').each(function(){ 1036 1037 $(this).removeAttr('width').removeAttr('height'); 1038 1039 if( ls.o.imgPreload === true && ls.o.lazyLoad === true ){ 1040 1041 if( typeof $(this).data('src') !== 'string' ){ 1042 1043 $(this).data('src', $(this).attr('src') ); 1044 var src = ls.o.skinsPath+'../css/blank.gif'; 1045 $(this).attr('src',src); 1046 } 1047 }else{ 1048 if( typeof $(this).data('src') === 'string' ){ 1049 1050 $(this).attr('src',$(this).data('src')); 1051 $(this).removeAttr('data-src'); 1052 } 1053 } 1054 1055 }); 1056 1057 // NEW FEATURE v5.0.0 Parallax layers by mousemove 1058 1059 $(el).find('.ls-slide').on('mouseenter',function(e){ 1060 1061 ls.g.parallaxStartX = e.pageX - $(this).parent().offset().left; 1062 ls.g.parallaxStartY = e.pageY - $(this).parent().offset().top; 1063 }); 1064 1065 $(el).find('.ls-slide').on('mousemove',function(e){ 1066 1067 var mX0 = $(this).parent().offset().left + ls.g.parallaxStartX; 1068 var mY0 = $(this).parent().offset().top + ls.g.parallaxStartY; 1069 1070 var mX = e.pageX - mX0; 1071 var mY = e.pageY - mY0; 1072 1073 $(this).find('> *:not(.ls-bg)').each(function(){ 1074 1075 if( typeof $(this).data('parallaxlevel') !== 'undefined' && parseInt( $(this).data('parallaxlevel') ) !== 0 ){ 1076 $(this).css({ 1077 marginLeft : -mX / 100 * parseInt( $(this).data('parallaxlevel') ), 1078 marginTop : -mY / 100 * parseInt( $(this).data('parallaxlevel') ) 1079 }); 1080 } 1081 }); 1082 }); 1083 1084 $(el).find('.ls-slide').on('mouseleave',function(){ 1085 1086 $(this).find('> *:not(.ls-bg)').each(function(){ 1087 1088 if( typeof $(this).data('parallaxlevel') !== 'undefined' && parseInt( $(this).data('parallaxlevel') ) !== 0 ){ 1089 TweenLite.to( this, .4, {css:{ 1090 marginLeft : 0, 1091 marginTop : 0 1092 } 1093 }); 1094 } 1095 }); 1096 }); 1097 1098 // Creating navigation 1099 1100 if( ls.o.navPrevNext ){ 1101 1102 $('<a class="ls-nav-prev" href="#" />').click(function(e){ 1103 e.preventDefault(); 1104 $(el).layerSlider('prev'); 1105 }).appendTo($(el)); 1106 1107 $('<a class="ls-nav-next" href="#" />').click(function(e){ 1108 e.preventDefault(); 1109 $(el).layerSlider('next'); 1110 }).appendTo($(el)); 1111 1112 if( ls.o.hoverPrevNext ){ 1113 $(el).find('.ls-nav-prev, .ls-nav-next').css({ 1114 display: 'none' 1115 }); 1116 1117 $(el).hover( 1118 function(){ 1119 if( !ls.g.forceHideControls ){ 1120 if( ls.g.ie78 ){ 1121 $(el).find('.ls-nav-prev, .ls-nav-next').css('display','block'); 1122 }else{ 1123 $(el).find('.ls-nav-prev, .ls-nav-next').stop(true,true).fadeIn(300); 1124 } 1125 } 1126 }, 1127 function(){ 1128 if( ls.g.ie78 ){ 1129 $(el).find('.ls-nav-prev, .ls-nav-next').css('display','none'); 1130 }else{ 1131 $(el).find('.ls-nav-prev, .ls-nav-next').stop(true,true).fadeOut(300); 1132 } 1133 } 1134 ); 1135 } 1136 } 1137 1138 // Creating bottom navigation 1139 1140 if( ls.o.navStartStop || ls.o.navButtons ){ 1141
1142 var bottomNav = $('<div class="ls-bottom-nav-wrapper" />').appendTo( $(el) ); 1143 1144 ls.g.bottomWrapper = bottomNav; 1145 1146 if( ls.o.thumbnailNavigation == 'always' ){ 1147 bottomNav.addClass('ls-above-thumbnails'); 1148 } 1149 1150 if( ls.o.navButtons && ls.o.thumbnailNavigation != 'always' ){ 1151 1152 $('<span class="ls-bottom-slidebuttons" />').appendTo( $(el).find('.ls-bottom-nav-wrapper') ); 1153 1154 // NEW FEATURE v3.5 thumbnailNavigation ('hover') 1155 1156 if( ls.o.thumbnailNavigation == 'hover' ){ 1157 1158 var thumbs = $('<div class="ls-thumbnail-hover"><div class="ls-thumbnail-hover-inner"><div class="ls-thumbnail-hover-bg"></div><div class="ls-thumbnail-hover-img"><img></div><span></span></div></div>').appendTo( $(el).find('.ls-bottom-slidebuttons') ); 1159 } 1160 1161 for(x=1;x<ls.g.layersNum+1;x++){ 1162 1163 var btn = $('<a href="#" />').appendTo( $(el).find('.ls-bottom-slidebuttons') ).click(function(e){ 1164 e.preventDefault(); 1165 $(el).layerSlider( ($(this).index() + 1) ); 1166 }); 1167 1168 // NEW FEATURE v3.5 thumbnailNavigation ('hover') 1169 1170 if( ls.o.thumbnailNavigation == 'hover' ){ 1171 1172 $(el).find('.ls-thumbnail-hover, .ls-thumbnail-hover-img').css({ 1173 width : ls.o.tnWidth, 1174 height : ls.o.tnHeight 1175 }); 1176 1177 var th = $(el).find('.ls-thumbnail-hover'); 1178 1179 var ti = th.find('img').css({ 1180 height : ls.o.tnHeight 1181 }); 1182 1183 var thi = $(el).find('.ls-thumbnail-hover-inner').css({ 1184 visibility : 'hidden', 1185 display: 'block' 1186 }); 1187 1188 btn.hover( 1189 function(){ 1190 1191 var hoverLayer = $(el).find('.ls-slide').eq( $(this).index() ); 1192 var tnSrc; 1193 1194 if( ls.o.imgPreload === true && ls.o.lazyLoad === true ){ 1195 1196 if( hoverLayer.find('.ls-tn').length ){ 1197 tnSrc = hoverLayer.find('.ls-tn').data('src'); 1198 }else if( hoverLayer.find('.ls-videopreview').length ){ 1199 tnSrc = hoverLayer.find('.ls-videopreview').attr('src'); 1200 }else if( hoverLayer.find('.ls-bg').length ){ 1201 tnSrc = hoverLayer.find('.ls-bg').data('src'); 1202 }else{ 1203 tnSrc = ls.o.skinsPath+ls.o.skin+'/nothumb.png'; 1204 } 1205 }else{ 1206 1207 if( hoverLayer.find('.ls-tn').length ){ 1208 tnSrc = hoverLayer.find('.ls-tn').attr('src'); 1209 }else if( hoverLayer.find('.ls-videopreview').length ){ 1210 tnSrc = hoverLayer.find('.ls-videopreview').attr('src'); 1211 }else if( hoverLayer.find('.ls-bg').length ){ 1212 tnSrc = hoverLayer.find('.ls-bg').attr('src'); 1213 }else{ 1214 tnSrc = ls.o.skinsPath+ls.o.skin+'/nothumb.png'; 1215 } 1216 } 1217 1218 $(el).find('.ls-thumbnail-hover-img').css({ 1219 left: parseInt( th.css('padding-left') ), 1220 top: parseInt( th.css('padding-top') ) 1221 }); 1222 1223 ti.load(function(){ 1224 1225 if( $(this).width() == 0 ){ 1226 ti.css({ 1227 position: 'relative', 1228 margin: '0 auto', 1229 left: 'auto' 1230 }); 1231 }else{ 1232 ti.css({ 1233 position: 'absolute', 1234 marginLeft : - $(this).width() / 2, 1235 left: '50%' 1236 }); 1237 } 1238 }).attr( 'src', tnSrc ); 1239 1240 th.css({ 1241 display: 'block' 1242 }).stop().animate({ 1243 left: $(this).position().left + ( $(this).width() - th.outerWidth() ) / 2 1244 }, 250 ); 1245 1246 thi.css({ 1247 display : 'none', 1248 visibility : 'visible' 1249 }).stop().fadeIn(250); 1250 }, 1251 function(){ 1252 thi.stop().fadeOut(250, function(){ 1253 th.css({ 1254 visibility : 'hidden', 1255 display: 'block' 1256 }); 1257 }); 1258 } 1259 ); 1260 } 1261 } 1262 1263 if( ls.o.thumbnailNavigation == 'hover' ){ 1264 1265 thumbs.appendTo( $(el).find('.ls-bottom-slidebuttons') ); 1266 } 1267 1268 $(el).find('.ls-bottom-slidebuttons a:eq('+(ls.o.firstSlide-1)+')').addClass('ls-nav-active'); 1269 } 1270 1271 if( ls.o.navStartStop ){ 1272 1273 var buttonStart = $('<a class="ls-nav-start" href="#" />').click(function(e){ 1274 e.preventDefault(); 1275 $(el).layerSlider('start'); 1276 }).prependTo( $(el).find('.ls-bottom-nav-wrapper') ); 1277 1278 var buttonStop = $('<a class="ls-nav-stop" href="#" />').click(function(e){ 1279 e.preventDefault(); 1280 $(el).layerSlider('stop'); 1281 }).appendTo( $(el).find('.ls-bottom-nav-wrapper') ); 1282 1283 }else if( ls.o.thumbnailNavigation != 'always' ){ 1284 1285 $('<span class="ls-nav-sides ls-nav-sideleft" />').prependTo( $(el).find('.ls-bottom-nav-wrapper') ); 1286 $('<span class="ls-nav-sides ls-nav-sideright" />').appendTo( $(el).find('.ls-bottom-nav-wrapper') ); 1287 } 1288 1289 if( ls.o.hoverBottomNav && ls.o.thumbnailNavigation != 'always' ){ 1290 1291 bottomNav.css({ 1292 display: 'none' 1293 }); 1294 1295 $(el).hover( 1296 function(){ 1297 if( !ls.g.forceHideControls ){ 1298 if( ls.g.ie78 ){ 1299 bottomNav.css('display','block'); 1300 }else{ 1301 bottomNav.stop(true,true).fadeIn(300); 1302 } 1303 } 1304 }, 1305 function(){ 1306 if( ls.g.ie78 ){ 1307 bottomNav.css('display','none'); 1308 }else{ 1309 bottomNav.stop(true,true).fadeOut(300); 1310 } 1311 } 1312 ) 1313 } 1314 } 1315 1316 // NEW FEATURE v3x.5 thumbnailNavigation ('always') 1317 1318 if( ls.o.thumbnailNavigation == 'always' ){ 1319
1320 ls.g.thumbsWrapper = $('<div class="ls-thumbnail-wrapper"></div>').appendTo( $(el) ); 1321 var thumbs = $('<div class="ls-thumbnail"><div class="ls-thumbnail-inner"><div class="ls-thumbnail-slide-container"><div class="ls-thumbnail-slide"></div></div></div></div>').appendTo( ls.g.thumbsWrapper ); 1322 1323 ls.g.thumbnails = $(el).find('.ls-thumbnail-slide-container'); 1324 1325 if( !('ontouchstart' in window) ){ 1326 ls.g.thumbnails.hover( 1327 function(){ 1328 $(this).addClass('ls-thumbnail-slide-hover'); 1329 }, 1330 function(){ 1331 $(this).removeClass('ls-thumbnail-slide-hover'); 1332 ls.scrollThumb(); 1333 } 1334 ).mousemove(function(e){ 1335 1336 var mL = parseInt(e.pageX - $(this).offset().left ) / $(this).width() * ( $(this).width() - $(this).find('.ls-thumbnail-slide').width() ); 1337 $(this).find('.ls-thumbnail-slide').stop().css({ 1338 marginLeft : mL 1339 }); 1340 }); 1341 }else{ 1342 ls.g.thumbnails.addClass('ls-touchscroll'); 1343 } 1344 1345 $(el).find('.ls-slide').each(function(){ 1346 1347 var tempIndex = $(this).index() + 1; 1348 var tnSrc; 1349 1350 if( ls.o.imgPreload === true && ls.o.lazyLoad === true ){ 1351 1352 if( $(this).find('.ls-tn').length ){ 1353 tnSrc = $(this).find('.ls-tn').data('src'); 1354 }else if( $(this).find('.ls-videopreview').length ){ 1355 tnSrc = $(this).find('.ls-videopreview').attr('src'); 1356 }else if( $(this).find('.ls-bg').length ){ 1357 tnSrc = $(this).find('.ls-bg').data('src'); 1358 }else{ 1359 tnSrc = ls.o.skinsPath+ls.o.skin+'/nothumb.png'; 1360 } 1361 }else{ 1362 1363 if( $(this).find('.ls-tn').length ){ 1364 tnSrc = $(this).find('.ls-tn').attr('src'); 1365 }else if( $(this).find('.ls-videopreview').length ){ 1366 tnSrc = $(this).find('.ls-videopreview').attr('src'); 1367 }else if( $(this).find('.ls-bg').length ){ 1368 tnSrc = $(this).find('.ls-bg').attr('src'); 1369 }else{ 1370 tnSrc = ls.o.skinsPath+ls.o.skin+'/nothumb.png'; 1371 } 1372 } 1373 1374 var thumb = $('<a href="#" class="ls-thumb-' + tempIndex + '"><img src="'+tnSrc+'"></a>'); 1375 thumb.appendTo( $(el).find('.ls-thumbnail-slide') ); 1376 1377 if( !('ontouchstart' in window) ){ 1378 1379 thumb.hover( 1380 function(){ 1381 $(this).children().stop().fadeTo(300,ls.o.tnActiveOpacity/100); 1382 }, 1383 function(){ 1384 if( !$(this).children().hasClass('ls-thumb-active') ){ 1385 $(this).children().stop().fadeTo(300,ls.o.tnInactiveOpacity/100); 1386 } 1387 } 1388 ); 1389 } 1390 1391 thumb.click(function(e){ 1392 e.preventDefault(); 1393 $(el).layerSlider( tempIndex ); 1394 }); 1395 }); 1396 1397 if( buttonStart && buttonStop ){ 1398 var lsBottomBelowTN = ls.g.bottomWrapper = $('<div class="ls-bottom-nav-wrapper ls-below-thumbnails"></div>').appendTo( $(el) ); 1399 buttonStart.clone().click(function(e){ 1400 e.preventDefault(); 1401 $(el).layerSlider('start'); 1402 }).appendTo( lsBottomBelowTN ); 1403 buttonStop.clone().click(function(e){ 1404 e.preventDefault(); 1405 $(el).layerSlider('stop'); 1406 }).appendTo( lsBottomBelowTN ); 1407 } 1408 1409 if( ls.o.hoverBottomNav ){ 1410 1411 ls.g.thumbsWrapper.css('display','none'); 1412 1413 if( lsBottomBelowTN ){ 1414 ls.g.bottomWrapper = lsBottomBelowTN.css('display') == 'block' ? lsBottomBelowTN : $(el).find('.ls-above-thumbnails'); 1415 ls.g.bottomWrapper.css('display','none'); 1416 } 1417 1418 // BUGFIXES v4.1.3 Added checking of the bottomWrapper variable 1419 1420 $(el).hover( 1421 function(){ 1422 $(el).addClass('ls-hover'); 1423 if( !ls.g.forceHideControls ){ 1424 if( ls.g.ie78 ){ 1425 ls.g.thumbsWrapper.css('display','block'); 1426 if( ls.g.bottomWrapper ){ 1427 ls.g.bottomWrapper.css('display','block'); 1428 } 1429 }else{ 1430 ls.g.thumbsWrapper.stop(true,true).fadeIn(300); 1431 if( ls.g.bottomWrapper ){ 1432 ls.g.bottomWrapper.stop(true,true).fadeIn(300); 1433 } 1434 } 1435 } 1436 }, 1437 function(){ 1438 $(el).removeClass('ls-hover'); 1439 if( ls.g.ie78 ){ 1440 ls.g.thumbsWrapper.css('display','none'); 1441 if( ls.g.bottomWrapper ){ 1442 ls.g.bottomWrapper.css('display','none'); 1443 } 1444 }else{ 1445 ls.g.thumbsWrapper.stop(true,true).fadeOut(300); 1446 if( ls.g.bottomWrapper ){ 1447 ls.g.bottomWrapper.stop(true,true).fadeOut(300); 1448 } 1449 } 1450 } 1451 ) 1452 } 1453 } 1454 1455 // Adding shadow wrapper 1456
1457 ls.g.shadow = $('<div class="ls-shadow"></div>').appendTo( $(el) ); 1458 if( ls.g.shadow.css('display') == 'block' && !ls.g.shadow.find('img').length ){ 1459 ls.g.showShadow = function(){ 1460 ls.g.shadow.css({ 1461 display: 'none', 1462 visibility: 'visible' 1463 }).fadeIn( 500, function(){ 1464 ls.g.showShadow = false; 1465 }); 1466 } 1467 ls.g.shadowImg = $('<img>').attr('src',ls.o.skinsPath+ls.o.skin+'/shadow.png').appendTo( ls.g.shadow ); 1468 ls.g.shadowBtmMod = typeof parseInt( $(el).css('padding-bottom') ) == 'number' ? parseInt( $(el).css('padding-bottom') ) : 0; 1469 } 1470 ls.resizeShadow(); 1471 1472 // Adding keyboard navigation if turned on and if number of layers > 1 1473 1474 if( ls.o.keybNav && $(el).find('.ls-slide').length > 1 ){ 1475 1476 $('body').bind('keydown',function(e){ 1477 if( !ls.g.isAnimating && !ls.g.isLoading ){ 1478 if( e.which == 37 ){ 1479 ls.o.cbPrev(ls.g); 1480 ls.prev('clicked'); 1481 }else if( e.which == 39 ){ 1482 ls.o.cbNext(ls.g); 1483 ls.next('clicked'); 1484 } 1485 } 1486 }); 1487 } 1488 1489 // Adding touch-control navigation if number of layers > 1 1490 1491 if('ontouchstart' in window && $(el).find('.ls-slide').length > 1 && ls.o.touchNav ){ 1492 1493 $(el).find('.ls-inner').bind('touchstart', function( e ) { 1494 var t = e.touches ? e.touches : e.originalEvent.touches; 1495 if( t.length == 1 ){ 1496 ls.g.touchStartX = ls.g.touchEndX = t[0].clientX; 1497 } 1498 }); 1499 1500 $(el).find('.ls-inner').bind('touchmove', function( e ) { 1501 var t = e.touches ? e.touches : e.originalEvent.touches; 1502 if( t.length == 1 ){ 1503 ls.g.touchEndX = t[0].clientX; 1504 } 1505 if( Math.abs( ls.g.touchStartX - ls.g.touchEndX ) > 45 ){ 1506 e.preventDefault(); 1507 } 1508 }); 1509 1510 $(el).find('.ls-inner').bind('touchend',function( e ){ 1511 if( Math.abs( ls.g.touchStartX - ls.g.touchEndX ) > 45 ){ 1512 if( ls.g.touchStartX - ls.g.touchEndX > 0 ){ 1513 ls.o.cbNext(ls.g); 1514 $(el).layerSlider('next'); 1515 }else{ 1516 ls.o.cbPrev(ls.g); 1517 $(el).layerSlider('prev'); 1518 } 1519 } 1520 }); 1521 } 1522 1523 // Feature: pauseOnHover (if number of layers > 1) 1524 1525 if( ls.o.pauseOnHover == true && $(el).find('.ls-slide').length > 1 ){ 1526 1527 // BUGFIX v1.6 stop was not working because of pause on hover 1528 1529 $(el).find('.ls-inner').hover( 1530 function(){ 1531 1532 // Calling cbPause callback function 1533 1534 ls.o.cbPause(ls.g); 1535 if( ls.g.autoSlideshow ){ 1536 ls.g.paused = true; 1537 ls.stop(); 1538 1539 // Stopping the animation of Timers 1540 1541 if( ls.g.barTimer ){ 1542 ls.g.barTimer.stop(); 1543 } 1544 1545 if( ls.g.circleTimer ){ 1546 if( ls.g.cttl ){ 1547 ls.g.cttl.pause(); 1548 } 1549 } 1550 ls.g.pausedSlideTime = new Date().getTime(); 1551 } 1552 }, 1553 function(){ 1554 if( ls.g.paused == true ){ 1555 ls.start(); 1556 ls.g.paused = false; 1557 } 1558 } 1559 ); 1560 } 1561 1562 ls.resizeSlider(); 1563 1564 // NEW FEATURE v1.7 added yourLogo 1565 1566 if( ls.o.yourLogo ){ 1567 ls.g.yourLogo = $('<img>').addClass('ls-yourlogo').appendTo($(el)).attr('style', ls.o.yourLogoStyle ).css({ 1568 visibility: 'hidden', 1569 display: 'bock' 1570 }).load(function(){ 1571 1572 // NEW FEATURE v3.0 added responsive yourLogo 1573 1574 var logoTimeout = 0; 1575 1576 if( !ls.g.yourLogo ){ 1577 logoTimeout = 1000; 1578 } 1579 1580 setTimeout( function(){ 1581 1582 ls.g.yourLogo.data( 'originalWidth', ls.g.yourLogo.width() ); 1583 ls.g.yourLogo.data( 'originalHeight', ls.g.yourLogo.height() ); 1584 if( ls.g.yourLogo.css('left') != 'auto' ){ 1585 ls.g.yourLogo.data( 'originalLeft', ls.g.yourLogo[0].style.left ); 1586 } 1587 if( ls.g.yourLogo.css('right') != 'auto' ){ 1588 ls.g.yourLogo.data( 'originalRight', ls.g.yourLogo[0].style.right ); 1589 } 1590 if( ls.g.yourLogo.css('top') != 'auto' ){ 1591 ls.g.yourLogo.data( 'originalTop', ls.g.yourLogo[0].style.top ); 1592 } 1593 if( ls.g.yourLogo.css('bottom') != 'auto' ){ 1594 ls.g.yourLogo.data( 'originalBottom', ls.g.yourLogo[0].style.bottom ); 1595 } 1596 1597 // NEW FEATURES v1.8 added yourLogoLink & yourLogoTarget 1598 1599 if( ls.o.yourLogoLink != false ){ 1600 $('<a>').appendTo($(el)).attr( 'href', ls.o.yourLogoLink ).attr('target', ls.o.yourLogoTarget ).css({
1601 textDecoration : 'none', 1602 outline : 'none' 1603 }).append( ls.g.yourLogo ); 1604 } 1605 1606 ls.g.yourLogo.css({ 1607 display: 'none', 1608 visibility: 'visible' 1609 }); 1610 1611 ls.resizeYourLogo(); 1612 1613 }, logoTimeout ); 1614 1615 }).attr( 'src', ls.o.yourLogo ); 1616 } 1617 1618 // NEW FEATURE v1.7 added window resize function for make responsive layout better 1619 1620 $(window).resize(function(){ 1621 1622 ls.resize(); 1623 }); 1624 1625 // BUGFIX v5.3.0 Responsiveness not worked in some cases while changed orientation on mobile devices 1626 1627 $(window).on('orientationchange',function(){ 1628 1629 $(window).resize(); 1630 }); 1631 1632 ls.g.showSlider = true; 1633 1634 // NEW FEATURE v1.7 animating first slide 1635 1636 if( ls.o.animateFirstSlide == true ){ 1637 if( ls.o.autoStart ){ 1638 ls.g.autoSlideshow = true; 1639 $(el).find('.ls-nav-start').addClass('ls-nav-start-active'); 1640 }else{ 1641 $(el).find('.ls-nav-stop').addClass('ls-nav-stop-active'); 1642 } 1643 ls.next(); 1644 }else if( typeof ls.g.curLayer[0] !== 'undefined' ){ 1645 ls.imgPreload(ls.g.curLayer,function(){ 1646 ls.g.curLayer.fadeIn(ls.o.sliderFadeInDuration, function(){ 1647 1648 ls.g.isLoading = false; 1649 1650 $(this).addClass('ls-active'); 1651 1652 // NEW FEATURE v2.0 autoPlayVideos 1653 1654 if( ls.o.autoPlayVideos ){ 1655 $(this).delay( $(this).data('delayin') + 25 ).queue(function(){ 1656 1657 // YouTube & Vimeo videos 1658 1659 $(this).find('.ls-videopreview').click(); 1660 1661 // HTML5 videos 1662 1663 $(this).find('video, audio').each(function(){ 1664 if( typeof $(this)[0].currentTime !== 0){ 1665 $(this)[0].currentTime = 0; 1666 } 1667 $(this).click(); 1668 }); 1669 1670 $(this).dequeue(); 1671 }); 1672 } 1673 1674 // NEW FEATURE v3.0 showUntil sublayers 1675 1676 ls.g.curLayer.find(' > *[class*="ls-l"]').each(function(){ 1677 1678 // Setting showUntilTimers 1679 1680 var cursub = $(this); 1681 1682 // IMPROVEMENT v5.2.0 video layers with auto play will skip showuntil feature 1683 1684 if( ( !cursub.hasClass('ls-video-layer') || ( cursub.hasClass('ls-video-layer') && ls.o.autoPlayVideos === false ) ) && cursub.data('showuntil') > 0 ){ 1685 1686 // IMPROVEMENT v4.5.0 sublayerShowUntil will be called anly if necessary 1687 1688 cursub.data('showUntilTimer', setTimeout(function(){ 1689 ls.sublayerShowUntil( cursub ); 1690 }, cursub.data('showuntil') )); 1691 } 1692 }); 1693 }); 1694 1695 ls.changeThumb(ls.g.curLayerIndex) 1696 1697 // If autoStart is true 1698 1699 if( ls.o.autoStart ){ 1700 ls.g.isLoading = false; 1701 ls.start(); 1702 }else{ 1703 $(el).find('.ls-nav-stop').addClass('ls-nav-stop-active'); 1704 } 1705 }); 1706 } 1707 1708 // NEW FEATURE v1.7 added cbInit function 1709 1710 ls.o.cbInit($(el)); 1711 }; 1712 1713 ls.resize = function(){ 1714 1715 ls.g.resize = true; 1716 1717 if( !ls.g.isAnimating ){ 1718 1719 ls.makeResponsive( ls.g.curLayer, function(){ 1720 if( ls.g.ltContainer ){ 1721 ls.g.ltContainer.empty(); 1722 } 1723 ls.g.resize = false; 1724 }); 1725 if( ls.g.yourLogo ){ 1726 ls.resizeYourLogo(); 1727 } 1728 } 1729 }; 1730 1731 ls.start = function(){ 1732 1733 if( ls.g.autoSlideshow ){ 1734 if( ls.g.prevNext == 'prev' && ls.o.twoWaySlideshow ){ 1735 ls.prev(); 1736 }else{ 1737 ls.next(); 1738 } 1739 }else{ 1740 ls.g.autoSlideshow = true; 1741 if( !ls.g.isAnimating && !ls.g.isLoading ){ 1742 ls.timer(); 1743 } 1744 } 1745 1746 $(el).find('.ls-nav-start').addClass('ls-nav-start-active'); 1747 $(el).find('.ls-nav-stop').removeClass('ls-nav-stop-active'); 1748 }; 1749 1750 ls.timer = function(){ 1751 1752 if( $(el).find('.ls-active').data('ls') ){ 1753 var sD = ls.st.slideDelay; 1754 }else{ 1755 var sD = ls.o.slideDelay; 1756 } 1757 1758 var delaytime = $(el).find('.ls-active').data('slidedelay') ? parseInt( $(el).find('.ls-active').data('slidedelay') ) : sD; 1759 1760 // BUGFIX v3.0 delaytime did not work on first layer if animateFirstSlide was set to off 1761 // BUGFIX v3.5 delaytime did not work on all layers in standalone version after bugfix 3.0 :) 1762 1763 if( !ls.o.animateFirstSlide && !$(el).find('.ls-active').data('slidedelay') ){ 1764 var tempD = $(el).find('.ls-slide:eq('+(ls.o.firstSlide-1)+')').data('slidedelay'); 1765 delaytime = tempD ? tempD : sD; 1766 } 1767 1768 clearTimeout( ls.g.slideTimer ); 1769 1770 // NEW FEATURE v4.5.0 Timers 1771 1772 if( ls.g.pausedSlideTime ){ 1773 if( !ls.g.startSlideTime ){ 1774 ls.g.startSlideTime = new Date().getTime(); 1775 } 1776 if( ls.g.startSlideTime > ls.g.pausedSlideTime ){ 1777 ls.g.pausedSlideTime = new Date().getTime(); 1778 } 1779 if(! ls.g.curSlideTime ){ 1780 ls.g.curSlideTime = delaytime; 1781 } 1782 ls.g.curSlideTime -= (ls.g.pausedSlideTime - ls.g.startSlideTime); 1783 ls.g.pausedSlideTime = false;
1784 ls.g.startSlideTime = new Date().getTime(); 1785 }else{ 1786 ls.g.curSlideTime = delaytime; 1787 ls.g.startSlideTime = new Date().getTime(); 1788 } 1789 1790 // BUGFIX v4.6.0 fixed Bar Timer animation on the fisrt slide if animateFirstSlide is false 1791 1792 ls.g.curSlideTime = parseInt( ls.g.curSlideTime ); 1793 1794 ls.g.slideTimer = setTimeout(function(){ 1795 ls.g.startSlideTime = ls.g.pausedSlideTime = ls.g.curSlideTime = false; 1796 ls.start(); 1797 }, ls.g.curSlideTime ); 1798 1799 // Animating Timers 1800 1801 if( ls.g.barTimer ){ 1802 ls.g.barTimer.animate({ 1803 width : ls.g.sliderWidth() 1804 }, ls.g.curSlideTime, 'linear', function(){ 1805 $(this).css({ 1806 width: 0 1807 }); 1808 }); 1809 } 1810 1811 if( ls.g.circleTimer ){ 1812 1813 var ct1 = ls.g.circleTimer.find('.ls-ct-right .ls-ct-rotate'); 1814 var ct2 = ls.g.circleTimer.find('.ls-ct-left .ls-ct-rotate'); 1815 1816 if( ls.g.circleTimer.css('display') == 'none' ){ 1817 1818 ct1.css({ 1819 rotate : 0 1820 }); 1821 1822 ct2.css({ 1823 rotate : 0 1824 }); 1825 1826 ls.g.circleTimer.fadeIn(350); 1827 } 1828 1829 if( !ls.g.cttl ){ 1830 ls.g.cttl = new TimelineLite(); 1831 ls.g.cttl.add( TweenLite.fromTo(ct1[0],delaytime/2000,{ 1832 rotation : 0 1833 },{ 1834 ease : Linear.easeNone, 1835 rotation : 180, 1836 onReverseComplete : function(){ 1837 ls.g.cttl = false; 1838 } 1839 })); 1840 ls.g.cttl.add( TweenLite.fromTo(ct2[0],delaytime/2000,{ 1841 rotation : 0 1842 },{ 1843 ease : Linear.easeNone, 1844 rotation : 180 1845 })); 1846 }else{ 1847 ls.g.cttl.resume(); 1848 } 1849 1850 } 1851 }; 1852 1853 ls.stop = function(){ 1854 1855 // Stopping Timers 1856 1857 ls.g.pausedSlideTime = new Date().getTime(); 1858 1859 if( ls.g.barTimer ){ 1860 ls.g.barTimer.stop(); 1861 } 1862 1863 if( ls.g.circleTimer ){ 1864 if( ls.g.cttl ){ 1865 ls.g.cttl.pause(); 1866 } 1867 } 1868 1869 if( !ls.g.paused && !ls.g.originalAutoSlideshow ){ 1870 $(el).find('.ls-nav-stop').addClass('ls-nav-stop-active'); 1871 $(el).find('.ls-nav-start').removeClass('ls-nav-start-active'); 1872 } 1873 clearTimeout( ls.g.slideTimer ); 1874 ls.g.autoSlideshow = false; 1875 }; 1876 1877 ls.forcestop = function(){ 1878 1879 clearTimeout( ls.g.slideTimer ); 1880 ls.g.autoSlideshow = false; 1881 1882 clearTimeout( ls.g.t1 ); 1883 clearTimeout( ls.g.t2 ); 1884 clearTimeout( ls.g.t3 ); 1885 clearTimeout( ls.g.t4 ); 1886 clearTimeout( ls.g.t5 ); 1887 1888 if( ls.g.barTimer ){ 1889 ls.g.barTimer.stop(); 1890 } 1891 1892 if( ls.g.circleTimer ){ 1893 if( ls.g.cttl ){ 1894 ls.g.cttl.pause(); 1895 } 1896 } 1897 1898 $(el).find('*').stop(true,false).dequeue(); 1899 $(el).find('.ls-slide >').each(function(){ 1900 if( $(this).data('tr') ){ 1901 $(this).data('tr').pause(); 1902 } 1903 }); 1904 1905 if( !ls.g.paused && !ls.g.originalAutoSlideshow ){ 1906 $(el).find('.ls-nav-stop').addClass('ls-nav-stop-active'); 1907 $(el).find('.ls-nav-start').removeClass('ls-nav-start-active'); 1908 } 1909 }; 1910 1911 ls.restart = function(){ 1912 1913 $(el).find('*').stop(); 1914 clearTimeout( ls.g.slideTimer ); 1915 ls.change(ls.g.curLayerIndex,ls.g.prevNext); 1916 }; 1917 1918 // Because of an ie7 bug, we have to check & format the strings correctly 1919 1920 ls.ieEasing = function( e ){ 1921 1922 // BUGFIX v1.6 and v1.8 some type of animations didn't work properly 1923 1924 if( $.trim(e.toLowerCase()) == 'swing' || $.trim(e.toLowerCase()) == 'linear'){ 1925 return e.toLowerCase(); 1926 }else{ 1927 return e.replace('easeinout','easeInOut').replace('easein','easeIn').replace('easeout','easeOut').replace('quad','Quad').replace('quart','Quart').replace('cubic','Cubic').replace('quint','Quint').replace('sine','Sine').replace('expo','Expo').replace('circ','Circ').replace('elastic','Elastic').replace('back','Back').replace('bounce','Bounce'); 1928 } 1929 }; 1930 1931 // Calculating prev layer 1932 1933 ls.prev = function(clicked){ 1934 1935 // NEW FEATURE v2.0 loops 1936 1937 if( ls.g.curLayerIndex < 2 ){ 1938 ls.g.nextLoop += 1; 1939 } 1940 1941 if( ( ls.g.nextLoop > ls.o.loops ) && ( ls.o.loops > 0 ) && !clicked ){ 1942 ls.g.nextLoop = 0; 1943 ls.stop(); 1944 if( ls.o.forceLoopNum == false ){ 1945 ls.o.loops = 0; 1946 } 1947 }else{ 1948 var prev = ls.g.curLayerIndex < 2 ? ls.g.layersNum : ls.g.curLayerIndex - 1; 1949 ls.g.prevNext = 'prev'; 1950 ls.change(prev,ls.g.prevNext); 1951 } 1952 }; 1953 1954 // Calculating next layer 1955 1956 ls.next = function(clicked){ 1957 1958 // NEW FEATURE v2.0 loops 1959 1960 if( !ls.o.randomSlideshow ){ 1961 1962 if( !(ls.g.curLayerIndex < ls.g.layersNum) ){ 1963 ls.g.nextLoop += 1; 1964 } 1965 1966 if( ( ls.g.nextLoop > ls.o.loops ) && ( ls.o.loops > 0 ) && !clicked ){ 1967 1968 ls.g.nextLoop = 0; 1969 ls.stop(); 1970 if( ls.o.forceLoopNum == false ){ 1971 ls.o.loops = 0; 1972 } 1973 }else{ 1974 1975 var next = ls.g.curLayerIndex < ls.g.layersNum ? ls.g.curLayerIndex + 1 : 1; 1976 ls.g.prevNext = 'next'; 1977 ls.change(next,ls.g.prevNext); 1978 } 1979 }else if( !clicked ){ 1980 1981 // NEW FEATURE v3.5 randomSlideshow 1982 1983 var next = ls.g.curLayerIndex; 1984 1985 var calcRand = function(){ 1986 1987 next = Math.floor(Math.random() * ls.g.layersNum) + 1; 1988 1989 if( next == ls.g.curLayerIndex ){ 1990 1991 calcRand(); 1992 }else{ 1993 ls.g.prevNext = 'next'; 1994 ls.change(next,ls.g.prevNext); 1995 } 1996 } 1997 1998 calcRand(); 1999 }else if( clicked ){ 2000 2001 var next = ls.g.curLayerIndex < ls.g.layersNum ? ls.g.curLayerIndex + 1 : 1; 2002 ls.g.prevNext = 'next'; 2003 ls.change(next,ls.g.prevNext); 2004 } 2005 2006 }; 2007 2008 ls.change = function(num,prevnext){ 2009 2010 // Stopping Timers if needed 2011 2012 ls.g.startSlideTime = ls.g.pausedSlideTime = ls.g.curSlideTime = false;
2013 2014 // IMPROVEMENT v4.6.0 Bar Timer animation 2015 2016 if( ls.g.barTimer ){ 2017 ls.g.barTimer.stop().delay(300).animate({ 2018 width: 0 2019 },450); 2020 } 2021 if( ls.g.circleTimer ){ 2022 ls.g.circleTimer.fadeOut(500); 2023 if( ls.g.cttl ){ 2024 ls.g.cttl.reverse().duration(.35); 2025 } 2026 } 2027 2028 // NEW FEATURE v2.0 videoPreview & autoPlayVideos 2029 2030 if( ls.g.pausedByVideo == true ){ 2031 ls.g.pausedByVideo = false; 2032 ls.g.autoSlideshow = ls.g.originalAutoSlideshow; 2033 2034 ls.g.curLayer.find('iframe[src*="youtube.com"], iframe[src*="youtu.be"], iframe[src*="player.vimeo"]').each(function(){ 2035 2036 $(this).parent().find('.ls-vpcontainer').fadeIn(ls.g.v.fi,function(){ 2037 $(this).parent().find('iframe').attr('src',''); 2038 }); 2039 }); 2040 2041 ls.g.curLayer.find('video, audio').each(function(){ 2042 2043 this.pause(); 2044 }); 2045 } 2046 2047 $(el).find('iframe[src*="youtube.com"], iframe[src*="youtu.be"], iframe[src*="player.vimeo"]').each(function(){ 2048 2049 // Clearing videoTimeouts 2050 2051 clearTimeout( $(this).data( 'videoTimer') ); 2052 }); 2053 2054 clearTimeout( ls.g.slideTimer ); 2055 ls.g.nextLayerIndex = num; 2056 ls.g.nextLayer = $(el).find('.ls-slide:eq('+(ls.g.nextLayerIndex-1)+')'); 2057 2058 // BUGFIX v1.6 fixed wrong directions of animations if navigating by slidebuttons 2059 2060 if( !prevnext ){ 2061 2062 if( ls.g.curLayerIndex < ls.g.nextLayerIndex ){ 2063 ls.g.prevNext = 'next'; 2064 }else{ 2065 ls.g.prevNext = 'prev'; 2066 } 2067 } 2068 2069 // Added timeOut to wait for the fade animation of videoPreview image... 2070 2071 var timeOut = 0; 2072 2073 if( $(el).find('iframe[src*="youtube.com"], iframe[src*="youtu.be"], iframe[src*="player.vimeo"]').length > 0 ){ 2074 timeOut = ls.g.v.fi; 2075 } 2076 2077 if( typeof ls.g.nextLayer[0] !== 'undefined' ){ 2078 ls.imgPreload(ls.g.nextLayer,function(){ 2079 ls.animate(); 2080 }); 2081 } 2082 }; 2083 2084 // Preloading images 2085 2086 ls.imgPreload = function(layer,callback){ 2087 2088 ls.g.isLoading = true; 2089 2090 // Showing slider for the first time 2091 2092 if( ls.g.showSlider ){ 2093 $(el).css({ 2094 visibility : 'visible' 2095 }); 2096 } 2097 2098 // If image preload is on 2099 2100 if( ls.o.imgPreload ){ 2101 2102 var preImages = []; 2103 var preloaded = 0; 2104 2105 // NEW FEATURE v1.8 Preloading background images of layers 2106 2107 if( layer.css('background-image') != 'none' && layer.css('background-image').indexOf('url') != -1 && !layer.hasClass('ls-preloaded') && !layer.hasClass('ls-not-preloaded') ){ 2108 var bgi = layer.css('background-image'); 2109 bgi = bgi.match(/url\((.*)\)/)[1].replace(/"/gi, ''); 2110 preImages[preImages.length] = [bgi, layer]; 2111 } 2112 2113 // Images inside layers 2114 2115 layer.find('img:not(.ls-preloaded, .ls-not-preloaded)').each(function(){ 2116 2117 // NEW FEATURE v5.0.0 Lazy-load 2118 2119 if( ls.o.lazyLoad === true ){ 2120 $(this).attr('src',$(this).data('src')); 2121 } 2122 preImages[preImages.length] = [$(this).attr('src'), $(this)]; 2123 }); 2124 2125 // Background images inside layers 2126 2127 layer.find('*').each(function(){ 2128 2129 // BUGFIX v1.7 fixed preload bug with sublayers with gradient backgrounds 2130 2131 if( $(this).css('background-image') != 'none' && $(this).css('background-image').indexOf('url') != -1 && !$(this).hasClass('ls-preloaded') && !$(this).hasClass('ls-not-preloaded') ){ 2132 var bgi = $(this).css('background-image'); 2133 bgi = bgi.match(/url\((.*)\)/)[1].replace(/"/gi, ''); 2134 preImages[preImages.length] = [bgi, $(this)]; 2135 } 2136 }); 2137 2138 // BUGFIX v1.7 if there are no images in a layer, calling the callback function 2139 2140 if(preImages.length == 0){ 2141 2142 $('.ls-thumbnail-wrapper, .ls-nav-next, .ls-nav-prev, .ls-bottom-nav-wrapper').css({ 2143 visibility : 'visible' 2144 }); 2145 2146 ls.makeResponsive(layer, callback); 2147 }else{ 2148 2149 // NEW FEATURE v4.0 Showing loading indicator 2150 2151 if( ls.g.ie78 ){ 2152 ls.g.li.css('display','block'); 2153 }else{ 2154 2155 // BUGIFX v4.1.3 Adding delay to the showing of the loading indicator 2156 2157 ls.g.li.delay(400).fadeIn(300); 2158 } 2159 2160 var afterImgLoad = function(){ 2161 2162 // NEW FEATURE v4.0 Hiding loading indicator 2163 2164 ls.g.li.stop(true,true).css({ 2165 display: 'none' 2166 }); 2167 2168 $('.ls-thumbnail-wrapper, .ls-nav-next, .ls-nav-prev, .ls-bottom-nav-wrapper').css({ 2169 visibility : 'visible' 2170 }); 2171 2172 // We love you so much IE... -.- 2173 2174 if( navigator.userAgent.indexOf('Trident/7') !== -1 || ls.g.ie78 ){ 2175 setTimeout(function(){ 2176 ls.makeResponsive(layer, callback); 2177 },50); 2178 }else{ 2179 ls.makeResponsive(layer, callback); 2180 } 2181 2182 }; 2183 2184 for(x=0;x<preImages.length;x++){ 2185 2186 $('<img>').data('el',preImages[x]).load(function(){ 2187 2188 $(this).data('el')[1].addClass('ls-preloaded'); 2189 2190 if( ++preloaded == preImages.length ){ 2191 2192 afterImgLoad(); 2193 } 2194 }).error(function(){ 2195 var imgURL = $(this).data('el')[0].substring($(this).data('el')[0].lastIndexOf("/") + 1, $(this).data('el')[0].length); 2196 if( window.console ){ 2197 console.log('LayerSlider error:\r\n\r\nIt seems like the URL of the image or background image "'+imgURL+'" is pointing to a wrong location and it cannot be loaded. Please check the URLs of all your images used in the slider.'); 2198 }else{ 2199 alert('LayerSlider error:\r\n\r\nIt seems like the URL of the image or background image "'+imgURL+'" is pointing to a wrong location and it cannot be loaded. Please check the URLs of all your images used in the slider.'); 2200 } 2201 2202 $(this).addClass('ls-not-preloaded'); 2203 2204 // IMPROVEMENT v5.2.0 The slider should not stop even if an image cannot be loaded 2205 2206 if( ++preloaded == preImages.length ){ 2207 2208 afterImgLoad(); 2209 } 2210 2211 }).attr('src',preImages[x][0]); 2212 } 2213 } 2214 }else{ 2215
2216 $('.ls-thumbnail-wrapper, .ls-nav-next, .ls-nav-prev, .ls-bottom-nav-wrapper').css({ 2217 visibility : 'visible' 2218 }); 2219 2220 ls.makeResponsive(layer, callback); 2221 } 2222 }; 2223 2224 // NEW FEATURE v1.7 making the slider responsive 2225 2226 ls.makeResponsive = function(layer, callback ){ 2227 2228 layer.css({ 2229 visibility: 'hidden', 2230 display: 'block' 2231 }); 2232 2233 if( ls.g.showShadow ){ 2234 ls.g.showShadow(); 2235 } 2236 2237 ls.resizeSlider(); 2238 2239 if( ls.o.thumbnailNavigation == 'always' ){ 2240 ls.resizeThumb(); 2241 } 2242 layer.children().each(function(){ 2243 2244 var sl = $(this); 2245 2246 // positioning 2247 2248 var ol = sl.data('originalLeft') ? sl.data('originalLeft') : '0'; 2249 var ot = sl.data('originalTop') ? sl.data('originalTop') : '0'; 2250 2251 if( sl.is('a') && sl.children().length > 0 ){ 2252 sl.css({ 2253 display : 'block' 2254 }); 2255 sl = sl.children(); 2256 } 2257 2258 var ow = 'auto'; 2259 var oh = 'auto'; 2260 2261 if( sl.data('originalWidth') ){ 2262 2263 if( typeof sl.data('originalWidth') == 'number' ){ 2264 ow = parseInt( sl.data('originalWidth') ) * ls.g.ratio; 2265 }else if( sl.data('originalWidth').indexOf('%') != -1 ){ 2266 ow = sl.data('originalWidth'); 2267 } 2268 } 2269 2270 if( sl.data('originalHeight') ){ 2271 if( typeof sl.data('originalHeight') == 'number' ){ 2272 oh = parseInt( sl.data('originalHeight') ) * ls.g.ratio; 2273 }else if( sl.data('originalHeight').indexOf('%') != -1 ){ 2274 oh = sl.data('originalHeight'); 2275 } 2276 } 2277 2278 // padding 2279 2280 var opl = sl.data('originalPaddingLeft') ? parseInt( sl.data('originalPaddingLeft') ) * ls.g.ratio : 0; 2281 var opr = sl.data('originalPaddingRight') ? parseInt( sl.data('originalPaddingRight') ) * ls.g.ratio : 0; 2282 var opt = sl.data('originalPaddingTop') ? parseInt( sl.data('originalPaddingTop') ) * ls.g.ratio : 0; 2283 var opb = sl.data('originalPaddingBottom') ? parseInt( sl.data('originalPaddingBottom') ) * ls.g.ratio : 0; 2284 2285 // border 2286 2287 var obl = sl.data('originalBorderLeft') ? parseInt( sl.data('originalBorderLeft') ) * ls.g.ratio : 0; 2288 var obr = sl.data('originalBorderRight') ? parseInt( sl.data('originalBorderRight') ) * ls.g.ratio : 0; 2289 var obt = sl.data('originalBorderTop') ? parseInt( sl.data('originalBorderTop') ) * ls.g.ratio : 0; 2290 var obb = sl.data('originalBorderBottom') ? parseInt( sl.data('originalBorderBottom') ) * ls.g.ratio : 0; 2291 2292 // font 2293 2294 var ofs = sl.data('originalFontSize'); 2295 var olh = sl.data('originalLineHeight'); 2296 2297 // NEW FEATURE v3.0 added "normal" responsive mode with image and font resizing 2298 // NEW FEATURE v3.5 added responsiveUnder 2299 2300 if( ls.g.responsiveMode || ls.o.responsiveUnder > 0 ){ 2301 2302 if( sl.is('img') && !sl.hasClass('ls-bg') && sl.attr('src') ){ 2303 2304 sl.css({ 2305 width: 'auto', 2306 height: 'auto' 2307 }); 2308 2309 // IMPROVEMENT v4.5.0 Images can have now starting width / height 2310 2311 if( ( ow == 0 || ow == 'auto' ) && typeof oh == 'number' && oh != 0 ){ 2312 ow = ( oh / sl.height() ) * sl.width(); 2313 } 2314 2315 if( ( oh == 0 || oh == 'auto' ) && typeof ow == 'number' && ow != 0 ){ 2316 oh = ( ow / sl.width() ) * sl.height(); 2317 } 2318 2319 if( ow == 'auto'){ 2320 ow = sl.width() * ls.g.ratio; 2321 } 2322 2323 if( oh == 'auto'){ 2324 oh = sl.height() * ls.g.ratio; 2325 } 2326 2327 sl.css({ 2328 width : ow, 2329 height : oh 2330 }); 2331 } 2332 2333 if( !sl.is('img') ){ 2334 sl.css({ 2335 width : ow, 2336 height : oh, 2337 'font-size' : parseInt(ofs) * ls.g.ratio +'px', 2338 'line-height' : parseInt(olh) * ls.g.ratio + 'px' 2339 }); 2340 } 2341 2342 if( sl.is('div') && sl.find('iframe').data('videoSrc') ){ 2343 2344 var videoIframe = sl.find('iframe'); 2345 videoIframe.attr('width', parseInt( videoIframe.data('originalWidth') ) * ls.g.ratio ).attr('height', parseInt( videoIframe.data('originalHeight') ) * ls.g.ratio ); 2346 2347 sl.css({ 2348 width : parseInt( videoIframe.data('originalWidth') ) * ls.g.ratio, 2349 height : parseInt( videoIframe.data('originalHeight') ) * ls.g.ratio 2350 }); 2351 } 2352 2353 sl.css({ 2354 padding : opt + 'px ' + opr + 'px ' + opb + 'px ' + opl + 'px ', 2355 borderLeftWidth : obl + 'px', 2356 borderRightWidth : obr + 'px', 2357 borderTopWidth : obt + 'px', 2358 borderBottomWidth : obb + 'px' 2359 }); 2360 } 2361 2362 // If it is NOT a bg sublayer 2363 2364 if( !sl.hasClass('ls-bg') ){ 2365 2366 var sl2 = sl; 2367 2368 if( sl.parent().is('a') ){ 2369 sl = sl.parent(); 2370 } 2371 2372 // NEW FEATURE v3.5 sublayerContainer 2373 2374 var slC = 0; 2375 if( ls.o.layersContainer ){ 2376 slC = ls.o.layersContainer > 0 ? ( ls.g.sliderWidth() - ls.o.layersContainer ) / 2 : 0; 2377 }else if( ls.o.sublayerContainer ){ 2378 slC = ls.o.sublayerContainer > 0 ? ( ls.g.sliderWidth() - ls.o.sublayerContainer ) / 2 : 0; 2379 } 2380 slC = slC < 0 ? 0 : slC; 2381 2382 // (RE)positioning sublayer (left property) 2383 2384 if( ol.indexOf('%') != -1 ){ 2385 sl.css({ 2386 left : ls.g.sliderWidth() / 100 * parseInt(ol) - sl2.width() / 2 - opl - obl 2387 }); 2388 }else if( slC > 0 || ls.g.responsiveMode || ls.o.responsiveUnder > 0 ){ 2389 sl.css({ 2390 left : slC + parseInt(ol) * ls.g.ratio 2391 }); 2392 } 2393 2394 // (RE)positioning sublayer (top property) 2395 2396 if( ot.indexOf('%') != -1 ){ 2397 sl.css({ 2398 top : ls.g.sliderHeight() / 100 * parseInt(ot) - sl2.height() / 2 - opt - obt 2399 }); 2400 }else if( ls.g.responsiveMode || ls.o.responsiveUnder > 0 ){ 2401 sl.css({ 2402 top : parseInt(ot) * ls.g.ratio 2403 }); 2404 } 2405 2406 }else{ 2407 2408 var inner = $(el).find('.ls-inner'); 2409 2410 sl.css({ 2411 width : '100%', 2412 height : 'auto' 2413 }); 2414 2415 ow = sl.width(); 2416 oh = sl.height(); 2417 sl.css({ 2418 width : ow, 2419 height : oh 2420 }); 2421 } 2422 }); 2423 2424 layer.css({ 2425 display: 'none', 2426 visibility: 'visible' 2427 }); 2428 2429 // Resizing shadow 2430 2431 ls.resizeShadow(); 2432 2433 callback(); 2434 2435 $(this).dequeue(); 2436 }; 2437 2438 // Resizing shadow 2439 2440 ls.resizeShadow = function(){ 2441 if( ls.g.shadowImg ){ 2442 var resizeShadow = function(){ 2443 if( ls.g.shadowImg.height() > 0 ){ 2444 if( ls.g.shadowBtmMod > 0 ){ 2445 ls.g.shadow.css({ 2446 height: ls.g.shadowImg.height() / 2 2447 }); 2448 }else{ 2449 ls.g.shadow.css({ 2450 height: ls.g.shadowImg.height(), 2451 marginTop: - ls.g.shadowImg.height() / 2 2452 }); 2453 } 2454 }else{ 2455 setTimeout(function(){ 2456 resizeShadow(); 2457 },50); 2458 } 2459 }; 2460 2461 resizeShadow(); 2462 } 2463 }; 2464 2465 // Resizing the slider 2466 2467 ls.resizeSlider = function(){ 2468 2469 if( ls.o.responsiveUnder > 0 ){ 2470 2471 if( $(window).width() < ls.o.responsiveUnder ){ 2472 ls.g.responsiveMode = true; 2473 ls.g.sliderOriginalWidth = ls.o.responsiveUnder + 'px'; 2474 }else{ 2475 ls.g.responsiveMode = false;
2476 ls.g.sliderOriginalWidth = ls.g.sliderOriginalWidthRU; 2477 ls.g.ratio = 1; 2478 } 2479 } 2480 2481 // BUGFIX 5.3.0 Fixed full-width resize issue 2482 2483 if( $(el).closest('.ls-wp-fullwidth-container').length ){ 2484 2485 $(el).closest('.ls-wp-fullwidth-helper').css({ 2486 width : $(window).width() 2487 }); 2488 } 2489 2490 // NEW FEATURE v3.0 added "normal" responsive mode with image and font resizing 2491 2492 if( ls.g.responsiveMode ){ 2493 2494 var parent = $(el).parent(); 2495 2496 // NEW FEATURE v5.5.0 Added fullScreen mode 2497 2498 if( ls.o.fullScreen === true ){ 2499 2500 $(el).css({ 2501 width : '100%', 2502 height : $(window).height() 2503 }); 2504 }else{ 2505 2506 // BUGFIX v4.0 there is no need to subtract the values of the left and right paddings of the container element! 2507 2508 $(el).css({ 2509 width : parent.width() - parseInt($(el).css('padding-left')) - parseInt($(el).css('padding-right')) 2510 }); 2511 ls.g.ratio = $(el).width() / parseInt( ls.g.sliderOriginalWidth ); 2512 $(el).css({ 2513 height : ls.g.ratio * parseInt( ls.g.sliderOriginalHeight ) 2514 }); 2515 } 2516 2517 }else{ 2518 ls.g.ratio = 1; 2519 $(el).css({ 2520 width : ls.g.sliderOriginalWidth, 2521 height : ls.g.sliderOriginalHeight 2522 }); 2523 } 2524 2525 // WP fullWidth mode (originally forceResponsive mode) 2526 2527 if( $(el).closest('.ls-wp-fullwidth-container').length ){ 2528 2529 $(el).closest('.ls-wp-fullwidth-helper').css({ 2530 height : $(el).outerHeight(true) 2531 }); 2532 2533 $(el).closest('.ls-wp-fullwidth-container').css({ 2534 height : $(el).outerHeight(true) 2535 }); 2536 2537 $(el).closest('.ls-wp-fullwidth-helper').css({ 2538 width : $(window).width(), 2539 left : - $(el).closest('.ls-wp-fullwidth-container').offset().left 2540 }); 2541 2542 if( ls.g.sliderOriginalWidth.indexOf('%') != -1 ){ 2543 2544 var percentWidth = parseInt( ls.g.sliderOriginalWidth ); 2545 var newWidth = $('body').width() / 100 * percentWidth - ( $(el).outerWidth() - $(el).width() ); 2546 $(el).width( newWidth ); 2547 } 2548 } 2549 2550 $(el).find('.ls-inner, .ls-lt-container').css({ 2551 width : ls.g.sliderWidth(), 2552 height : ls.g.sliderHeight() 2553 }); 2554 2555 // BUGFIX v2.0 fixed width problem if firstSlide is not 1 2556 2557 if( ls.g.curLayer && ls.g.nextLayer ){ 2558 2559 ls.g.curLayer.css({ 2560 width : ls.g.sliderWidth(), 2561 height : ls.g.sliderHeight() 2562 }); 2563 2564 ls.g.nextLayer.css({ 2565 width : ls.g.sliderWidth(), 2566 height : ls.g.sliderHeight() 2567 }); 2568 2569 }else{ 2570 2571 $(el).find('.ls-slide').css({ 2572 width : ls.g.sliderWidth(), 2573 height : ls.g.sliderHeight() 2574 }); 2575 } 2576 }; 2577 2578 // NEW FEATURE v3.0 added responsive yourLogo 2579 2580 ls.resizeYourLogo = function(){ 2581 2582 ls.g.yourLogo.css({ 2583 width : ls.g.yourLogo.data( 'originalWidth' ) * ls.g.ratio, 2584 height : ls.g.yourLogo.data( 'originalHeight' ) * ls.g.ratio 2585 }); 2586 2587 if( ls.g.ie78 ){ 2588 ls.g.yourLogo.css('display','block'); 2589 }else{ 2590 ls.g.yourLogo.fadeIn(300); 2591 } 2592 2593 var oL = oR = oT = oB = 'auto'; 2594 2595 if( ls.g.yourLogo.data( 'originalLeft' ) && ls.g.yourLogo.data( 'originalLeft' ).indexOf('%') != -1 ){ 2596 oL = ls.g.sliderWidth() / 100 * parseInt( ls.g.yourLogo.data( 'originalLeft' ) ) - ls.g.yourLogo.width() / 2 + parseInt( $(el).css('padding-left') ); 2597 }else{ 2598 oL = parseInt( ls.g.yourLogo.data( 'originalLeft' ) ) * ls.g.ratio; 2599 } 2600 2601 if( ls.g.yourLogo.data( 'originalRight' ) && ls.g.yourLogo.data( 'originalRight' ).indexOf('%') != -1 ){ 2602 oR = ls.g.sliderWidth() / 100 * parseInt( ls.g.yourLogo.data( 'originalRight' ) ) - ls.g.yourLogo.width() / 2 + parseInt( $(el).css('padding-right') ); 2603 }else{ 2604 oR = parseInt( ls.g.yourLogo.data( 'originalRight' ) ) * ls.g.ratio; 2605 } 2606 2607 if( ls.g.yourLogo.data( 'originalTop' ) && ls.g.yourLogo.data( 'originalTop' ).indexOf('%') != -1 ){ 2608 oT = ls.g.sliderHeight() / 100 * parseInt( ls.g.yourLogo.data( 'originalTop' ) ) - ls.g.yourLogo.height() / 2 + parseInt( $(el).css('padding-top') ); 2609 }else{ 2610 oT = parseInt( ls.g.yourLogo.data( 'originalTop' ) ) * ls.g.ratio; 2611 } 2612 2613 if( ls.g.yourLogo.data( 'originalBottom' ) && ls.g.yourLogo.data( 'originalBottom' ).indexOf('%') != -1 ){ 2614 oB = ls.g.sliderHeight() / 100 * parseInt( ls.g.yourLogo.data( 'originalBottom' ) ) - ls.g.yourLogo.height() / 2 + parseInt( $(el).css('padding-bottom') ); 2615 }else{ 2616 oB = parseInt( ls.g.yourLogo.data( 'originalBottom' ) ) * ls.g.ratio; 2617 } 2618 2619 ls.g.yourLogo.css({ 2620 left : oL, 2621 right : oR, 2622 top : oT, 2623 bottom : oB 2624 }); 2625 }; 2626 2627 // NEW FEATURE v3.5 thumbnailNavigation ('always') 2628 2629 // Resizing thumbnails 2630 2631 ls.resizeThumb = function(){ 2632 2633 ls.bottomNavSizeHelper('on'); 2634 2635 var sliderW = ls.g.sliderOriginalWidth.indexOf('%') == -1 ? parseInt( ls.g.sliderOriginalWidth )
2635: ls.g.sliderWidth(); 2636 2637 $(el).find('.ls-thumbnail-slide a').css({ 2638 width : parseInt( ls.o.tnWidth * ls.g.ratio ), 2639 height : parseInt( ls.o.tnHeight * ls.g.ratio ) 2640 }); 2641 2642 $(el).find('.ls-thumbnail-slide a:last').css({ 2643 margin: 0 2644 }); 2645 2646 $(el).find('.ls-thumbnail-slide').css({ 2647 height : parseInt( ls.o.tnHeight * ls.g.ratio ) 2648 }); 2649 2650 var tn = $(el).find('.ls-thumbnail'); 2651 2652 var originalWidth = ls.o.tnContainerWidth.indexOf('%') == -1 ? parseInt( ls.o.tnContainerWidth ) : parseInt( sliderW / 100 * parseInt( ls.o.tnContainerWidth ) ); 2653 2654 tn.css({ 2655 width : originalWidth * Math.floor( ls.g.ratio * 100 ) / 100 2656 }); 2657 2658 if( tn.width() > $(el).find('.ls-thumbnail-slide').width() ){ 2659 tn.css({ 2660 width : $(el).find('.ls-thumbnail-slide').width() 2661 }); 2662 } 2663 2664 ls.bottomNavSizeHelper('off'); 2665 }; 2666 2667 // Changing thumbnails 2668 2669 ls.changeThumb = function(index){ 2670 2671 var curIndex = index ? index : ls.g.nextLayerIndex; 2672 2673 $(el).find('.ls-thumbnail-slide a:not(.ls-thumb-'+curIndex+')').children().each(function(){ 2674 $(this).removeClass('ls-thumb-active').stop().fadeTo(750,ls.o.tnInactiveOpacity/100); 2675 }); 2676 2677 $(el).find('.ls-thumbnail-slide a.ls-thumb-'+curIndex).children().addClass('ls-thumb-active').stop().fadeTo(750,ls.o.tnActiveOpacity/100); 2678 }; 2679 2680 // Scrolling thumbnails 2681 2682 ls.scrollThumb = function(){ 2683 2684 if( !$(el).find('.ls-thumbnail-slide-container').hasClass('ls-thumbnail-slide-hover') ){ 2685 var curThumb = $(el).find('.ls-thumb-active').length ? $(el).find('.ls-thumb-active').parent() : false; 2686 if( curThumb ){ 2687 var thumbCenter = curThumb.position().left + curThumb.width() / 2; 2688 var mL = $(el).find('.ls-thumbnail-slide-container').width() / 2 - thumbCenter; 2689 mL = mL < $(el).find('.ls-thumbnail-slide-container').width() - $(el).find('.ls-thumbnail-slide').width() ? $(el).find('.ls-thumbnail-slide-container').width() - $(el).find('.ls-thumbnail-slide').width() : mL; 2690 mL = mL > 0 ? 0 : mL; 2691 $(el).find('.ls-thumbnail-slide').animate({ 2692 marginLeft : mL 2693 }, 600 ); 2694 } 2695 } 2696 }; 2697 2698 // IMPROVEMENT v4.1.3 Changed the working of some Thumbnail and Bottom Navigation features 2699 2700 ls.bottomNavSizeHelper = function(val){ 2701 2702 if( ls.o.hoverBottomNav && !$(el).hasClass('ls-hover') ){ 2703 switch(val){ 2704 case 'on': 2705 ls.g.thumbsWrapper.css({ 2706 visibility: 'hidden', 2707 display: 'block' 2708 }); 2709 break; 2710 case 'off': 2711 ls.g.thumbsWrapper.css({ 2712 visibility: 'visible', 2713 display: 'none' 2714 }); 2715 break; 2716 } 2717 } 2718 }; 2719 2720 // Animating layers and sublayers 2721 2722 ls.animate = function(){ 2723 2724 /* GLOBAL (used by both old and new transitions ) */ 2725 2726 // Changing variables 2727 // BUGFIX v4.6.0 If there is only one layer, there is no need to set ls.g.isAnimating to true 2728 2729 if( $(el).find('.ls-slide').length > 1 ){ 2730 ls.g.isAnimating = true; 2731 } 2732 2733 ls.g.isLoading = false; 2734 2735 // Clearing timeouts 2736 2737 clearTimeout( ls.g.slideTimer ); 2738 clearTimeout( ls.g.changeTimer ); 2739 2740 ls.g.stopLayer = ls.g.curLayer; 2741 2742 // Calling cbAnimStart callback function 2743 2744 ls.o.cbAnimStart(ls.g); 2745 2746 // NEW FEATURE v3.5 thumbnailNavigation ('always') 2747 2748 if( ls.o.thumbnailNavigation == 'always' ){ 2749 2750 // ChangeThumb 2751 2752 ls.changeThumb(); 2753 2754 // ScrollThumb 2755 2756 if( !('ontouchstart' in window) ){ 2757 ls.scrollThumb(); 2758 } 2759 } 2760 2761 // Adding .ls-animating class to next layer 2762 2763 ls.g.nextLayer.addClass('ls-animating'); 2764 2765 2766 2767 /* OLD layer transitions (version 3.x) */ 2768 2769 // Setting position and styling of current and next layers 2770 2771 var curLayerLeft = curLayerRight = curLayerTop = curLayerBottom = nextLayerLeft = nextLayerRight = nextLayerTop = nextLayerBottom = layerMarginLeft = layerMarginRight = layerMarginTop = layerMarginBottom = 'auto'; 2772 var curLayerWidth = nextLayerWidth = ls.g.sliderWidth(); 2773 var curLayerHeight = nextLayerHeight = ls.g.sliderHeight(); 2774 2775 // Calculating direction 2776 2777 var prevOrNext = ls.g.prevNext == 'prev' ? ls.g.curLayer : ls.g.nextLayer; 2778 var chooseDirection = prevOrNext.data('slidedirection') ? prevOrNext.data('slidedirection') : ls.o.slideDirection; 2779 2780 // Setting the direction of sliding 2781 2782 var slideDirection = ls.g.slideDirections[ls.g.prevNext][chooseDirection]; 2783 2784 if( slideDirection == 'left' || slideDirection == 'right' ){ 2785 curLayerWidth = curLayerTop = nextLayerWidth = nextLayerTop = 0; 2786 layerMarginTop = 0; 2787 } 2788 if( slideDirection == 'top' || slideDirection == 'bottom' ){ 2789 curLayerHeight = curLayerLeft = nextLayerHeight = nextLayerLeft = 0; 2790 layerMarginLeft = 0; 2791 } 2792 2793 switch(slideDirection){ 2794 case 'left': 2795 curLayerRight = nextLayerLeft = 0; 2796 layerMarginLeft = -ls.g.sliderWidth(); 2797 break; 2798 case 'right': 2799 curLayerLeft = nextLayerRight = 0; 2800 layerMarginLeft = ls.g.sliderWidth(); 2801 break; 2802 case 'top': 2803 curLayerBottom = nextLayerTop = 0; 2804 layerMarginTop = -ls.g.sliderHeight(); 2805 break; 2806 case 'bottom': 2807 curLayerTop = nextLayerBottom = 0; 2808 layerMarginTop = ls.g.sliderHeight(); 2809 break; 2810 } 2811 2812 // Setting start positions and styles of layers 2813 2814 ls.g.curLayer.css({ 2815 left : curLayerLeft, 2816 right : curLayerRight, 2817 top : curLayerTop, 2818 bottom : curLayerBottom 2819 }); 2820 ls.g.nextLayer.css({ 2821 width : nextLayerWidth, 2822 height : nextLayerHeight, 2823 left : nextLayerLeft, 2824 right : nextLayerRight, 2825 top : nextLayerTop, 2826 bottom : nextLayerBottom 2827 }); 2828 2829 // Creating variables for the OLD transitions of CURRENT LAYER 2830 2831 // BUGFIX v1.6 fixed some wrong parameters of current layer 2832 // BUGFIX v1.7 fixed using of delayout of current layer 2833 2834 var curDelay = ls.g.curLayer.data('delayout') ? parseInt(ls.g.curLayer.data('delayout')) : ls.o.delayOut; 2835 2836 var curDuration = ls.g.curLayer.data('durationout') ? parseInt(ls.g.curLayer.data('durationout')) : ls.o.durationOut; 2837 var curEasing = ls.g.curLayer.data('easingout') ? ls.g.curLayer.data('easingout') : ls.o.easingOut; 2838 2839 // Creating variables for the OLD transitions of NEXT LAYER 2840 2841 var nextDelay = ls.g.nextLayer.data('delayin') ? parseInt(ls.g.nextLayer.data('delayin')) : ls.o.delayIn; 2842 var nextDuration = ls.g.nextLayer.data('durationin') ? parseInt(ls.g.nextLayer.data('durationin')) : ls.o.durationIn; 2843 2844 // BUGFIX v5.2.0 duration cannot be 0 2845 2846 if( nextDuration === 0 ){ nextDuration = 1 } 2847 var nextEasing = ls.g.nextLayer.data('easingin') ? ls.g.nextLayer.data('easingin') : ls.o.easingIn; 2848 2849 var curLayer = function(){ 2850 2851 // BUGFIX v1.6 added an additional delaytime to current layer to fix the '1px ga
2851p' bug 2852 // BUGFIX v3.0 modified from curDuration / 80 to curDuration / 15 2853 2854 ls.g.curLayer.delay( curDelay + curDuration / 15).animate({ 2855 width : curLayerWidth, 2856 height : curLayerHeight 2857 }, curDuration, curEasing,function(){ 2858 2859 curLayerCallback(); 2860 }); 2861 }; 2862 2863 var curLayerCallback = function(){ 2864 2865 // Stopping current sublayer animations if needed (they are not visible at this point). 2866 2867 ls.g.stopLayer.find(' > *[class*="ls-l"]').each(function(){ 2868 if( $(this).data('tr') ){ 2869 $(this).data('tr').kill(); 2870 } 2871 2872 $(this).css({ 2873 filter: 'none' 2874 }); 2875 }); 2876 2877 // Setting current layer 2878 2879 ls.g.curLayer = ls.g.nextLayer; 2880 2881 // IMPROVEMENT v5.2.0 added prevLayerIndex and fixing curLayerIndex (nextLayerIndex is the same as curLayerIndex because the slider doesn't know at this point which slide will be the next) 2882 2883 ls.g.prevLayerIndex = ls.g.curLayerIndex; 2884 ls.g.curLayerIndex = ls.g.nextLayerIndex; 2885 2886 ls.o.cbAnimStop(ls.g); 2887 2888 // NEW FEATURE v5.0.0 Lazy-load (preloading here the images of the next layer) 2889 2890 if( ls.o.imgPreload && ls.o.lazyLoad ){ 2891 2892 var preLayerIndex = ls.g.curLayerIndex == ls.g.layersNum ? 1 : ls.g.curLayerIndex + 1; 2893 $(el).find('.ls-slide').eq(preLayerIndex-1).find('img:not(.ls-preloaded)').each(function(){ 2894 $(this).load(function(){ 2895 $(this).addClass('ls-preloaded'); 2896 }).error(function(){ 2897 var imgURL = $(this).data('src').substring($(this).data('src').lastIndexOf("/") + 1, $(this).data('src').length); 2898 if( window.console ){ 2899 console('LayerSlider error:\r\n\r\nIt seems like the URL of the image or background image "'+imgURL+'" is pointing to a wrong location and it cannot be loaded. Please check the URLs of all your images used in the slider.'); 2900 }else{ 2901 alert('LayerSlider error:\r\n\r\nIt seems like the URL of the image or background image "'+imgURL+'" is pointing to a wrong location and it cannot be loaded. Please check the URLs of all your images used in the slider.'); 2902 } 2903 $(this).addClass('ls-not-preloaded'); 2904 }).attr('src', $(this).data('src')); 2905 }); 2906 } 2907 2908 // Changing some css classes 2909 2910 $(el).find('.ls-slide').removeClass('ls-active'); 2911 $(el).find('.ls-slide:eq(' + ( ls.g.curLayerIndex - 1 ) + ')').addClass('ls-active').removeClass('ls-animating'); 2912 $(el).find('.ls-bottom-slidebuttons a').removeClass('ls-nav-active'); 2913 $(el).find('.ls-bottom-slidebuttons a:eq('+( ls.g.curLayerIndex - 1 )+')').addClass('ls-nav-active'); 2914 2915 // Setting timer if needed 2916 2917 if( ls.g.autoSlideshow ){ 2918 ls.timer(); 2919 } 2920 2921 // Changing variables 2922 2923 ls.g.isAnimating = false; 2924 if( ls.g.resize == true ){ 2925 ls.makeResponsive( ls.g.curLayer, function(){ 2926 ls.g.resize = false; 2927 }); 2928 } 2929 }; 2930 2931 var curSubLayers = function(sublayersDurationOut){ 2932 2933 ls.g.curLayer.find(' > *[class*="ls-l"]').each(function(){ 2934 2935 if( !$(this).data('transitiontype') ){ 2936 ls.transitionType( $(this) ); 2937 } 2938 2939 // BUGFIX v5.1.0 Removing ls-videohack class before starting transition 2940 2941 $(this).removeClass('ls-videohack'); 2942 2943 var curSubSlideDir = $(this).data('slidedirection') ? $(this).data('slidedirection') : slideDirection; 2944 var lml, lmt; 2945 2946 switch(curSubSlideDir){ 2947 case 'left': 2948 lml = -ls.g.sliderWidth(); 2949 lmt = 0; 2950 break; 2951 case 'right': 2952 lml = ls.g.sliderWidth(); 2953 lmt = 0; 2954 break; 2955 case 'top': 2956 lmt = -ls.g.sliderHeight(); 2957 lml = 0; 2958 break; 2959 case 'bottom': 2960 lmt = ls.g.sliderHeight(); 2961 lml = 0; 2962 break; 2963 case 'fade': 2964 lmt = 0; 2965 lml = 0; 2966 break; 2967 } 2968 2969 // NEW FEATURE v1.6 added slideoutdirection to sublayers 2970 // NEW FEATURES 5.0.0 added axis-free transitions with offsetx and offsety properties 2971 2972 if( $(this).data('transitiontype') === 'new' ){ 2973 var curSubSlideOutDir = 'new'; 2974 }else{ 2975 var curSubSlideOutDir = $(this).data('slideoutdirection') ? $(this).data('slideoutdirection') : false;
2976 } 2977 2978 switch(curSubSlideOutDir){ 2979 case 'left': 2980 lml = ls.g.sliderWidth(); 2981 lmt = 0; 2982 break; 2983 case 'right': 2984 lml = -ls.g.sliderWidth(); 2985 lmt = 0; 2986 break; 2987 case 'top': 2988 lmt = ls.g.sliderHeight(); 2989 lml = 0; 2990 break; 2991 case 'bottom': 2992 lmt = -ls.g.sliderHeight(); 2993 lml = 0; 2994 break; 2995 case 'fade': 2996 lmt = 0; 2997 lml = 0; 2998 break; 2999 case 'new': 3000 if( $(this).data('offsetxout') ){ 3001 if( $(this).data('offsetxout') === 'left' ){ 3002 lml = ls.g.sliderWidth(); 3003 }else if( $(this).data('offsetxout') === 'right' ){ 3004 lml = -ls.g.sliderWidth(); 3005 }else{ 3006 lml = -parseInt( $(this).data('offsetxout') ); 3007 } 3008 }else{ 3009 lml = -ls.lt.offsetXOut; 3010 } 3011 if( $(this).data('offsetyout') ){ 3012 if( $(this).data('offsetyout') === 'top' ){ 3013 lmt = ls.g.sliderHeight(); 3014 }else if( $(this).data('offsetyout') === 'bottom' ){ 3015 lmt = -ls.g.sliderHeight(); 3016 }else{ 3017 lmt = -parseInt( $(this).data('offsetyout') ); 3018 } 3019 }else{ 3020 lmt = -ls.lt.offsetYOut; 3021 } 3022 break; 3023 } 3024 3025 // NEW FEATURES v4.5.0 Rotating & Scaling sublayers 3026 // BUGFIX v4.5.5 changing the default value from 0 to 'none' (because of old jQuery, 1.7.2) 3027 // NEW FEATURES v5.0.0 Added SkewX, SkewY, ScaleX, ScaleY, RotateX & RotateY transitions 3028 3029 var curSubRotate = curSubRotateX = curSubRotateY = curSubScale = curSubSkewX = curSubSkewY = curSubScaleX = curSubScaleY = 'none'; 3030// if( !ls.g.ie78 && ls.g.enableCSS3 ){ 3031 curSubRotate = $(this).data('rotateout') ? $(this).data('rotateout') : ls.lt.rotateOut; 3032 curSubRotateX = $(this).data('rotatexout') ? $(this).data('rotatexout') : ls.lt.rotateXOut; 3033 curSubRotateY = $(this).data('rotateyout') ? $(this).data('rotateyout') : ls.lt.rotateYOut; 3034 curSubScale = $(this).data('scaleout') ? $(this).data('scaleout') : ls.lt.scaleOut; 3035 curSubSkewX = $(this).data('skewxout') ? $(this).data('skewxout') : ls.lt.skewXOut; 3036 curSubSkewY = $(this).data('skewyout') ? $(this).data('skewyout') : ls.lt.skewYOut; 3037 if( curSubScale === 1 ){ 3038 curSubScaleX = $(this).data('scalexout') ? $(this).data('scalexout') : ls.lt.scaleXOut; 3039 curSubScaleY = $(this).data('scaleyout') ? $(this).data('scaleyout') : ls.lt.scaleYOut; 3040 }else{ 3041 curSubScaleX = curSubScaleY = curSubScale; 3042 } 3043 var too = $(this).data('transformoriginout') ? $(this).data('transformoriginout').split(' ') : ls.lt.transformOriginOut; 3044 for(var t =0;t<too.length;t++){ 3045 if( too[t].indexOf('%') === -1 && too[t].indexOf('left') !== -1 && too[t].indexOf('right') !== -1 && too[t].indexOf('top') !== -1 && too[t].indexOf('bottom') !== -1 ){ 3046 too[t] = '' + parseInt( too[t] ) * ls.g.ratio + 'px'; 3047 } 3048 } 3049 var curSubTransformOrigin = too.join(' '); 3050 var curSubPerspective = $(this).data('perspectiveout') ? $(this).data('perspectiveout') : ls.lt.perspectiveOut; 3051// } 3052 3053 // IMPROVEMENT v4.0 Distance (P.level): -1 3054 3055 var endLeft = parseInt( $(this).css('left') ); 3056 var endTop = parseInt( $(this).css('top') ); 3057 3058 var curSubPLevel = parseInt( $(this).attr('class').split('ls-l')[1] ); 3059 3060 var wh = $(this).outerWidth() > $(this).outerHeight() ? $(this).outerWidth() : $(this).outerHeight(); 3061 var modX = parseInt( curSubRotate ) === 0 ? $(this).outerWidth() : wh; 3062 var modY = parseInt( curSubRotate ) === 0 ? $(this).outerHeight() : wh; 3063 3064 if( ( curSubPLevel === -1 && curSubSlideOutDir !== 'new' ) || ( $(this).data('offsetxout') === 'left' || $(this).data('offsetxout') === 'right' ) ){ 3065 if( lml < 0 ){ 3066 lml = - ( ls.g.sliderWidth() - endLeft + ( curSubScaleX / 2 - .5 ) * modX + 100 ); 3067 }else if( lml > 0 ){ 3068 lml = endLeft + ( curSubScaleX / 2 + .5 ) * modX + 100; 3069 } 3070 }else{ 3071 lml = lml * ls.g.ratio; 3072 } 3073 3074 if( ( curSubPLevel === -1 && curSubSlideOutDir !== 'new' ) || ( $(this).data('offsetyout') === 'top' || $(this).data('offsetyout') === 'bottom' ) ){
3075 if( lmt < 0 ){ 3076 lmt = - ( ls.g.sliderHeight() - endTop + ( curSubScaleY / 2 - .5 ) * modY + 100 ); 3077 }else if( lmt > 0 ){ 3078 lmt = endTop + ( curSubScaleY / 2 + .5 ) * modY + 100; 3079 } 3080 }else{ 3081 lmt = lmt * ls.g.ratio; 3082 } 3083 3084 if( curSubPLevel === -1 || curSubSlideOutDir === 'new' ){ 3085 var curSubPar = 1; 3086 }else{ 3087 var curSubParMod = ls.g.curLayer.data('parallaxout') ? parseInt(ls.g.curLayer.data('parallaxout')) : ls.o.parallaxOut; 3088 var curSubPar = curSubPLevel * curSubParMod; 3089 } 3090 3091 if( $(this).data('transitiontype') === 'new' ){ 3092 var deO = ls.lt.delayOut; 3093 var duO = ls.lt.durationOut; 3094 var eO = ls.lt.easingOut; 3095 }else{ 3096 var deO = ls.o.delayOut; 3097 var duO = ls.o.durationOut; 3098 var eO = ls.o.easingOut; 3099 } 3100 3101 var curSubDelay = $(this).data('delayout') ? parseInt($(this).data('delayout')) : deO; 3102 var curSubTime = $(this).data('durationout') ? parseInt($(this).data('durationout')) : duO; 3103 3104 // BUGFIX v5.2.0 duration cannot be 0 3105 3106 if( curSubTime === 0 ){ curSubTime = 1 } 3107 var curSubEasing = $(this).data('easingout') ? $(this).data('easingout') : eO; 3108 3109 // On new layer transitions, all sublayer will be slide / fade out in 500ms without any delays 3110 3111 if(sublayersDurationOut){ 3112 curSubDelay = 0; 3113 curSubTime = sublayersDurationOut; 3114 // curSubEasing = 'easeInExpo'; 3115 } 3116 3117 // Clearing showUntilTimers 3118 3119 if( $(this).data('showUntilTimer') ){ 3120 clearTimeout( $(this).data('showUntilTimer') ); 3121 } 3122 3123 var css = { 3124 visibility : 'hidden' 3125 }; 3126 3127 var el = $(this); 3128 3129 var transition = { 3130 rotation : curSubRotate, 3131 rotationX : curSubRotateX, 3132 rotationY : curSubRotateY, 3133 skewX : curSubSkewX, 3134 skewY : curSubSkewY, 3135 scaleX : curSubScaleX, 3136 scaleY : curSubScaleY, 3137 x : -lml * curSubPar, 3138 y : -lmt * curSubPar, 3139 delay : curSubDelay/1000, 3140 ease : lsConvertEasing( curSubEasing ), 3141 onComplete : function(){ 3142 el.css( css ); 3143 } 3144 }; 3145 3146 if( curSubSlideOutDir == 'fade' || ( !curSubSlideOutDir && curSubSlideDir === 'fade' ) || ( $(this).data('fadeout') !== 'false' && $(this).data('transitiontype') === 'new' ) ){ 3147 transition['opacity'] = 0; 3148 css['opacity'] = $(this).data( 'originalOpacity' ); 3149 } 3150 3151 if( $(this).data('tr') ){ 3152 $(this).data('tr').kill(); 3153 } 3154 3155 TweenLite.set( $(this)[0],{ 3156 transformOrigin : curSubTransformOrigin, 3157 transformPerspective : curSubPerspective 3158 }); 3159 3160 $(this).data('tr', TweenLite.to($(this)[0],curSubTime/1000,transition) ); 3161 3162 // $(this).stop(true,false).delay( curSubDelay ).animate( transition, curSubTime, curSubEasing,function(){ 3163 // $(this).css( css ); 3164 // }); 3165 }); 3166 }; 3167 3168 var nextLayer = function(){ 3169 3170 ls.g.nextLayer.delay( curDelay + nextDelay ).animate({ 3171 width : ls.g.sliderWidth(), 3172 height : ls.g.sliderHeight() 3173 }, nextDuration, nextEasing ); 3174 }; 3175 3176 var nextSubLayers = function(){ 3177 3178 if( ls.g.totalDuration ){ 3179 curDelay = 0; 3180 } 3181 3182 // Needed for the Timeline 3183 if( typeof ls.o.cbTimeLineStart === 'function' ){ 3184 ls.o.cbTimeLineStart(ls.g, curDelay+nextDelay ); 3185 } 3186 3187 ls.g.nextLayer.find(' > *[class*="ls-l"]').each(function(){ 3188 3189 // Replacing global parameters with unique if need 3190 // NEW FEATURES 5.0.0 added axis-free transitions with offsetx and offsety properties 3191 3192 if( !$(this).data('transitiontype') ){ 3193 ls.transitionType( $(this) ); 3194 } 3195 3196 if( $(this).data('transitiontype') === 'new' ){ 3197 var nextSubSlideDir = 'new'; 3198 }else{ 3199 var nextSubSlideDir = $(this).data('slidedirection') ? $(this).data('slidedirection') : slideDirection; 3200 } 3201 var lml, lmt; 3202 3203 switch(nextSubSlideDir){ 3204 case 'left': 3205 lml = -ls.g.sliderWidth(); 3206 lmt = 0; 3207 break; 3208 case 'right': 3209 lml = ls.g.sliderWidth(); 3210 lmt = 0; 3211 break; 3212 case 'top': 3213 lmt = -ls.g.sliderHeight(); 3214 lml = 0; 3215 break; 3216 case 'bottom': 3217 lmt = ls.g.sliderHeight(); 3218 lml = 0; 3219 break; 3220 case 'fade': 3221 lmt = 0; 3222 lml = 0; 3223 break; 3224 case 'new': 3225 if( $(this).data('offsetxin') ){ 3226 if( $(this).data('offsetxin') === 'left' ){ 3227 lml = -ls.g.sliderWidth(); 3228 }else if( $(this).data('offsetxin') === 'right' ){ 3229 lml = ls.g.sliderWidth(); 3230 }else{ 3231 lml = parseInt( $(this).data('offsetxin') ); 3232 } 3233 }else{ 3234 lml = ls.lt.offsetXIn; 3235 } 3236 if( $(this).data('offsetyin') ){ 3237 if( $(this).data('offsetyin') === 'top' ){ 3238 lmt = -ls.g.sliderHeight(); 3239 }else if( $(this).data('offsetyin') === 'bottom' ){ 3240 lmt = ls.g.sliderHeight(); 3241 }else{ 3242 lmt = parseInt( $(this).data('offsetyin') ); 3243 } 3244 }else{ 3245 lmt = ls.lt.offsetYIn; 3246 } 3247 break; 3248 } 3249 3250 // NEW FEATURE v4.5.0 Rotating & Scaling sublayers 3251 // BUGFIX v4.5.5 changing the default value from 0 to 'none' (because of old jQuery, 1.7.2) 3252 // NEW FEATURES v5.0.0 Added SkewX, SkewY, ScaleX, ScaleY, RotateX & RotateY transitions 3253 3254 var nextSubRotate = nextSubRotateX = nextSubRotateY = nextSubScale = nextSubSkewX
3254= nextSubSkewY = nextSubScaleX = nextSubScaleY = 'none'; 3255// if( !ls.g.ie78 && ls.g.enableCSS3 ){ 3256 nextSubRotate = $(this).data('rotatein') ? $(this).data('rotatein') : ls.lt.rotateIn; 3257 nextSubRotateX = $(this).data('rotatexin') ? $(this).data('rotatexin') : ls.lt.rotateXIn; 3258 nextSubRotateY = $(this).data('rotateyin') ? $(this).data('rotateyin') : ls.lt.rotateYIn; 3259 nextSubScale = $(this).data('scalein') ? $(this).data('scalein') : ls.lt.scaleIn; 3260 nextSubSkewX = $(this).data('skewxin') ? $(this).data('skewxin') : ls.lt.skewXIn; 3261 nextSubSkewY = $(this).data('skewyin') ? $(this).data('skewyin') : ls.lt.skewYIn; 3262 if( nextSubScale === 1 ){ 3263 nextSubScaleX = $(this).data('scalexin') ? $(this).data('scalexin') : ls.lt.scaleXIn; 3264 nextSubScaleY = $(this).data('scaleyin') ? $(this).data('scaleyin') : ls.lt.scaleYIn; 3265 }else{ 3266 nextSubScaleX = nextSubScaleY = nextSubScale; 3267 } 3268 3269 var toi = $(this).data('transformoriginin') ? $(this).data('transformoriginin').split(' ') : ls.lt.transformOriginIn; 3270 for(var t =0;t<toi.length;t++){ 3271 if( toi[t].indexOf('%') === -1 && toi[t].indexOf('left') !== -1 && toi[t].indexOf('right') !== -1 && toi[t].indexOf('top') !== -1 && toi[t].indexOf('bottom') !== -1 ){ 3272 toi[t] = '' + parseInt( toi[t] ) * ls.g.ratio + 'px'; 3273 } 3274 } 3275 var nextSubTransformOrigin = toi.join(' '); 3276 var nextSubPerspective = $(this).data('perspectivein') ? $(this).data('perspectivein') : ls.lt.perspectiveIn; 3277// } 3278 3279 // IMPROVEMENT v4.0 Distance (P.level): -1 3280 3281 var endLeft = parseInt( $(this).css('left') ); 3282 var endTop = parseInt( $(this).css('top') ); 3283 3284 var nextSubPLevel = parseInt( $(this).attr('class').split('ls-l')[1] ); 3285 3286 // BUGFIX v5.0.1 Fixed the starting position of layers with percentage value of width 3287 3288 if( $(this)[0].style.width.indexOf('%') !== -1 ){ 3289 $(this).css({ 3290 width: ls.g.sliderWidth() / 100 * parseInt( $(this)[0].style.width ) 3291 }); 3292 } 3293 3294 var wh = $(this).outerWidth() > $(this).outerHeight() ? $(this).outerWidth() : $(this).outerHeight(); 3295 var modX = parseInt( nextSubRotate ) === 0 ? $(this).outerWidth() : wh; 3296 var modY = parseInt( nextSubRotate ) === 0 ? $(this).outerHeight() : wh; 3297 3298 // console.log( modX, $(this).outerWidth(), $(this).width(), $(this).height(), $(this)[0].style.width, $(this).outerHeight(), wh ); 3299 3300 if( ( nextSubPLevel === -1 && nextSubSlideDir !== 'new' ) || ( $(this).data('offsetxin') === 'left' || $(this).data('offsetxin') === 'right' ) ){ 3301 if( lml < 0 ){ 3302 lml = - ( endLeft + ( nextSubScaleX / 2 + .5 ) * modX + 100 ); 3303 }else if( lml > 0 ){ 3304 lml = ls.g.sliderWidth() - endLeft + ( nextSubScaleX / 2 - .5 ) * modX + 100; 3305 } 3306 }else{ 3307 lml = lml * ls.g.ratio; 3308 } 3309 3310 if( ( nextSubPLevel === -1 && nextSubSlideDir !== 'new' ) || ( $(this).data('offsetyin') === 'top' || $(this).data('offsetyin') === 'bottom' ) ){ 3311 3312 if( lmt < 0 ){ 3313 lmt = - ( endTop + ( nextSubScaleY / 2 + .5 ) * modY + 100 ); 3314 }else if( lmt > 0 ){ 3315 lmt = ls.g.sliderHeight() - endTop + ( nextSubScaleY / 2 - .5 ) * modY + 100; 3316 } 3317 }else{ 3318 lmt = lmt * ls.g.ratio; 3319 } 3320 3321 if( nextSubPLevel === -1 || nextSubSlideDir === 'new'){ 3322 var nextSubPar = 1; 3323 }else{ 3324 var nextSubParMod = ls.g.nextLayer.data('parallaxin') ? parseInt(ls.g.nextLayer.data('parallaxin')) : ls.o.parallaxIn; 3325 var nextSubPar = nextSubPLevel * nextSubParMod; 3326 } 3327 3328 if( $(this).data('transitiontype') === 'new' ){ 3329 var deI = ls.lt.delayIn; 3330 var duI = ls.lt.durationIn; 3331 var eI = ls.lt.easingIn; 3332 }else{ 3333 var deI = ls.o.delayIn; 3334 var duI = ls.o.durationIn; 3335 var eI = ls.o.easingIn; 3336 } 3337 3338 var nextSubDelay = $(this).data('delayin') ? parseInt($(this).data('delayin')) : deI; 3339 var nextSubTime = $(this).data('durationin') ? parseInt($(this).data('durationin')) : duI; 3340 var nextSubEasing = $(this).data('easingin') ? $(this).data('easingin') : eI; 3341 3342 var cursub = $(this); 3343 3344 var nextSubCallback = function(){ 3345 3346 // BUGFIX v5.1.0 Removing transition property from video layers 3347 3348 if( cursub.hasClass('ls-video-layer') ){ 3349 cursub.addClass('ls-videohack'); 3350 } 3351 3352 // NEW FEATURE v2.0 autoPlayVideos 3353 3354 if( ls.o.autoPlayVideos == true ){ 3355 3356 // YouTube & Vimeo videos 3357 3358 cursub.find('.ls-videopreview').click(); 3359 3360 // HTML5 videos 3361 3362 cursub.find('video, audio').each(function(){ 3363 if( typeof $(this)[0].currentTime !== 0){ 3364 $(this)[0].currentTime = 0; 3365 } 3366 $(this).click(); 3367 }); 3368 } 3369 3370 // NEW FEATURE v3.0 showUntil sublayers 3371 // IMPROVEMENT v5.2.0 video layers with auto play will skip showuntil feature 3372 3373 if( ( !cursub.hasClass('ls-video-layer') || ( cursub.hasClass('ls-video-layer') && ls.o.autoPlayVideos === false ) ) && cursub.data('showuntil') > 0 ){ 3374 3375 // IMPROVEMENT v4.5.0 sublayerShowUntil will be called anly if necessary 3376 3377 cursub.data('showUntilTimer', setTimeout(function(){ 3378 ls.sublayerShowUntil( cursub ); 3379 }, cursub.data('showuntil') )); 3380 } 3381 }; 3382 3383 $(this).css({ 3384 marginLeft : 0, 3385 marginTop : 0 3386 }); 3387 3388 var css = { 3389 scaleX : nextSubScaleX, 3390 scaleY : nextSubScaleY, 3391 skewX : nextSubSkewX, 3392 skewY : nextSubSkewY, 3393 rotation : nextSubRotate, 3394 rotationX : nextSubRotateX, 3395 rotationY : nextSubRotateY, 3396 visibility : 'visible', 3397 x : lml * nextSubPar, 3398 y : lmt * nextSubPar 3399 }; 3400 3401 var transition = { 3402 rotation : 0, 3403 rotationX : 0, 3404 rotationY : 0, 3405 skewX : 0, 3406 skewY : 0, 3407 scaleX : 1, 3408 scaleY : 1, 3409 ease : lsConvertEasing( nextSubEasing ), 3410 delay : nextSubDelay/1000, 3411 x : 0, 3412 y : 0, 3413 onComplete : function(){ 3414 nextSubCallback(); 3415 } 3416 }; 3417 3418 if( nextSubSlideDir.indexOf('fade') != -1 || ( $(this).data('fadein') !== 'false' && $(this).data('transitiontype') === 'new' ) ){ 3419 3420 css['opacity'] = 0; 3421 transition['opacity'] = $(this).data( 'originalOpacity' ); 3422 } 3423 3424 // $(this).css( css ); 3425 3426 // $(this).stop().delay( curDelay + nextDelay + nextSubDelay ).animate( transition, nextSubTime, nextSubEasing, function(){ 3427 // if( ls.g.ie78 & $(this).data( 'originalOpacity') === 1 ){ 3428 // $(this).get(0).style.removeAttribute('filter'); 3429 // } 3430 // nextSubCallback(); 3431 // }); 3432 3433 if( $(this).data('tr') ){ 3434 $(this).data('tr').kill(); 3435 } 3436 3437 TweenLite.set( $(this)[0],{ 3438 transformPerspective : nextSubPerspective, 3439 transformOrigin : nextSubTransformOrigin 3440 }); 3441 3442 $(this).data('tr', TweenLite.fromTo($(this)[0],nextSubTime/1000,css,transition) ); 3443 }); 3444 }; 3445 3446 /* NEW FEATURE v4.0 2D & 3D Layer Transitions */ 3447 3448 // Selecting ONE transition (random) 3449 // If the browser doesn't support CSS3 3D, 2D fallback mode will be used instead 3450 // In this case, if user didn't specify any 2D transitions, a random will be selected 3451 3452 var selectTransition = function(){ 3453 3454 // if the browser supports CSS3 3D and user specified at least one of 3D transitions 3455 3456 if( lsSupport3D( $(el) ) && ( ls.g.nextLayer.data('transition3d') || ls.g.nextLayer.data('customtransition3d') ) ){ 3457 3458 if( ls.g.nextLayer.data('transition3d') && ls.g.nextLayer.data('customtransition3d') ){ 3459 var rnd = Math.floor(Math.random() * 2); 3460 var rndT = [['3d',ls.g.nextLayer.data('transition3d')],['custom3d',ls.g.nextLayer.data('customtransition3d')]]; 3461 getTransitionType(rndT[rnd][0],rndT[rnd][1]); 3462 }else if( ls.g.nextLayer.data('transition3d') ){ 3463 getTransitionType('3d',ls.g.nextLayer.data('transition3d')); 3464 }else{ 3465 getTransitionType('custom3d',ls.g.nextLayer.data('customtransition3d')); 3466 } 3467 3468 }else{ 3469 3470 if( ls.g.nextLayer.data('transition2d') && ls.g.nextLayer.data('customtransition2d') ){ 3471 var rnd = Math.floor(Math.random() * 2); 3472 var rndT = [['2d',ls.g.nextLayer.data('transition2d')],['custom2d',ls.g.nextLayer.data('customtransition2d')]]; 3473 getTransitionType(rndT[rnd][0],rndT[rnd][1]); 3474 }else if( ls.g.nextLayer.data('transition2d') ){ 3475 getTransitionType('2d',ls.g.nextLayer.data('transition2d')); 3476 }else if( ls.g.nextLayer.data('customtransition2d') ){ 3477 getTransitionType('custom2d',ls.g.nextLayer.data('customtransition2d')); 3478 }else{ 3479 getTransitionType('2d','1'); 3480 } 3481 } 3482 }; 3483 3484 // Needed by the demo page 3485 3486 var selectCustomTransition = function(){ 3487 3488 if( lsSupport3D( $(el) ) && LSCustomTransition.indexOf('3d') != -1 ){
3489 getTransitionType('3d',LSCustomTransition.split(':')[1]); 3490 }else{ 3491 if( LSCustomTransition.indexOf('3d') != -1){ 3492 getTransitionType('2d','all'); 3493 }else{ 3494 getTransitionType('2d',LSCustomTransition.split(':')[1]); 3495 } 3496 } 3497 }; 3498 3499 // Choosing layer transition type (2d, 3d, or both) 3500 3501 var getTransitionType = function(type,transitionlist){ 3502 3503 var tr = type.indexOf('custom') == -1 ? ls.t : ls.ct; 3504 var tt = '3d', lt, number; 3505 3506 if( type.indexOf('2d') != -1 ){ 3507 tt = '2d'; 3508 } 3509 3510 if( transitionlist.indexOf('last') != -1 ){ 3511 number = tr['t'+tt].length-1; 3512 lt = 'last'; 3513 }else if( transitionlist.indexOf('all') != -1){ 3514 number = Math.floor(Math.random() * lsCountProp(tr['t'+tt]) ); 3515 lt = 'random from all'; 3516 }else{ 3517 var t = transitionlist.split(','); 3518 var l = t.length; 3519 number = parseInt(t[Math.floor(Math.random() * l)])-1; 3520 lt = 'random from specified'; 3521 } 3522 3523 slideTransition(tt,tr['t'+tt][number]); 3524 3525// $('.test').html('Originals:<br><br>t3D: '+ls.g.nextLayer.data('transition3d')+'<br>t2D: '+ls.g.nextLayer.data('transition2d')+'<br>custom3D: '+ls.g.nextLayer.data('customtransition3d')+'<br>custom2D: '+ls.g.nextLayer.data('customtransition2d')+'<br><br>Support 3D: '+lsSupport3D( $(el) )+'<br><br>Selected transition:<br><br>Type: '+type+' ('+lt+')<br>Number in transition list: '+(number+1)+'<br>Name of the transition: '+tr['t'+tt][number]['name']); 3526 }; 3527 3528 // The slideTransition function 3529 3530 var slideTransition = function(type,prop){ 3531 3532 var inner = $(el).find('.ls-inner'); 3533 3534 // sublayersDurationOut - for future usage 3535 3536 var sublayersDurationOut = ls.g.curLayer.find('*[class*="ls-l"]').length > 0 ? 1000 : 0; 3537 3538 // Detecting a carousel transition - Transition name must have the carousel string 3539 3540 var carousel = prop.name.toLowerCase().indexOf('carousel') == -1 ? false : true; 3541 3542 // Detecting a crossfade transition - Transition name must have the crossfad string 3543 3544 var crossfade = prop.name.toLowerCase().indexOf('crossfad') == -1 ? false : true; 3545 3546 // Calculating cols and rows 3547 3548 var cols = typeof(prop.cols); 3549 var rows = typeof(prop.rows); 3550 3551 switch( cols ){ 3552 case 'number': 3553 cols = prop.cols; 3554 break; 3555 case 'string': 3556 cols = Math.floor( Math.random() * ( parseInt( prop.cols.split(',')[1] ) - parseInt( prop.cols.split(',')[0] ) + 1) ) + parseInt( prop.cols.split(',')[0] ); 3557 break; 3558 default: 3559 cols = Math.floor( Math.random() * ( prop.cols[1] - prop.cols[0] + 1) ) + prop.cols[0]; 3560 break; 3561 } 3562 3563 switch( rows ){ 3564 case 'number': 3565 rows = prop.rows; 3566 break; 3567 case 'string': 3568 rows = Math.floor( Math.random() * ( parseInt( prop.rows.split(',')[1] ) - parseInt( prop.rows.split(',')[0] ) + 1) ) + parseInt( prop.rows.split(',')[0] ); 3569 break; 3570 default: 3571 rows = Math.floor( Math.random() * ( prop.rows[1] - prop.rows[0] + 1) ) + prop.rows[0]; 3572 break; 3573 } 3574 3575 if( ( ls.g.isMobile() == true && ls.o.optimizeForMobile == true ) || ( ls.g.ie78 && ls.o.optimizeForIE78 == true ) ){ 3576 3577 // Reducing cols in three steps 3578 3579 if( cols >= 15 ){ 3580 cols = 7; 3581 }else if( cols >= 5 ){ 3582 cols = 4; 3583 }else if( cols >= 4 ){ 3584 cols = 3; 3585 }else if( cols > 2 ){ 3586 cols = 2; 3587 } 3588 3589 // Reducing rows in three steps 3590 3591 if( rows >= 15 ){ 3592 rows = 7; 3593 }else if( rows >= 5 ){ 3594 rows = 4; 3595 }else if( rows >= 4 ){ 3596 rows = 3; 3597 }else if( rows > 2 ){ 3598 rows = 2; 3599 } 3600 3601 // Reducing more :) 3602 3603 if( rows > 2 && cols > 2 ){ 3604 rows = 2; 3605 if( cols > 4){ 3606 cols = 4; 3607 } 3608 } 3609 } 3610 3611 var tileWidth = $(el).find('.ls-inner').width() / cols; 3612 var tileHeight = $(el).find('.ls-inner').height() / rows; 3613 3614 // Creating HTML markup for layer transitions 3615 3616 if( !ls.g.ltContainer ){
3617 ls.g.ltContainer = $('<div>').addClass('ls-lt-container').addClass('ls-overflow-hidden').css({ 3618 width : inner.width(), 3619 height : inner.height() 3620 }).prependTo( inner ); 3621 }else{ 3622 ls.g.ltContainer.stop(true,true).empty().css({ 3623 display : 'block', 3624 width : inner.width(), 3625 height : inner.height() 3626 }); 3627 } 3628 3629 // Setting size 3630 3631 var restW = inner.width() - Math.floor(tileWidth) * cols; 3632 var restH = inner.height() - Math.floor(tileHeight) * rows; 3633 3634 var tileSequence = []; 3635 3636 // IMPROVEMENT v4.1.3 Array-randomizer is now a local function 3637 // Randomize array function 3638 3639 tileSequence.randomize = function() { 3640 var i = this.length, j, tempi, tempj; 3641 if ( i == 0 ) return false; 3642 while ( --i ) { 3643 j = Math.floor( Math.random() * ( i + 1 ) ); 3644 tempi = this[i]; 3645 tempj = this[j]; 3646 this[i] = tempj; 3647 this[j] = tempi; 3648 } 3649 return this; 3650 } 3651 3652 for(var ts=0; ts<cols * rows; ts++){ 3653 tileSequence.push(ts); 3654 } 3655 3656 // Setting the sequences of the transition 3657 3658 switch( prop.tile.sequence ){ 3659 case 'reverse': 3660 tileSequence.reverse(); 3661 break; 3662 case 'col-forward': 3663 tileSequence = lsOrderArray(rows,cols,'forward'); 3664 break; 3665 case 'col-reverse': 3666 tileSequence = lsOrderArray(rows,cols,'reverse'); 3667 break; 3668 case 'random': 3669 tileSequence.randomize(); 3670 break; 3671 } 3672 3673 var curBG = ls.g.curLayer.find('.ls-bg'); 3674 var nextBG = ls.g.nextLayer.find('.ls-bg'); 3675 3676 // IMPROVEMENT v4.6.0 If current and next layer both have no BG, skipping the slide transition 3677 3678 if( curBG.length == 0 && nextBG.length == 0 ){ 3679 type = '2d'; 3680 prop = $.extend(true, {}, ls.t['t2d'][0]); 3681 prop.transition.duration = 1 3682 prop.tile.delay = 0; 3683 } 3684 3685 if( type == '3d' ){ 3686 ls.g.totalDuration = ((cols * rows) - 1) * prop.tile.delay; 3687 3688 var stepDuration = 0; 3689 3690 if( prop.before && prop.before.duration ){ 3691 stepDuration += prop.before.duration; 3692 } 3693 if( prop.animation && prop.animation.duration ){ 3694 stepDuration += prop.animation.duration; 3695 } 3696 if( prop.after && prop.after.duration ){ 3697 stepDuration += prop.after.duration; 3698 } 3699 3700 ls.g.totalDuration += stepDuration; 3701 3702 var stepDelay = 0; 3703 3704 if( prop.before && prop.before.delay ){ 3705 stepDelay += prop.before.delay; 3706 } 3707 if( prop.animation && prop.animation.delay ){ 3708 stepDelay += prop.animation.delay; 3709 } 3710 if( prop.after && prop.after.delay ){ 3711 stepDelay += prop.after.delay; 3712 } 3713 3714 ls.g.totalDuration += stepDelay; 3715 3716 }else{ 3717 ls.g.totalDuration = ((cols * rows) - 1) * prop.tile.delay + prop.transition.duration; 3718 3719 // IMPROVEMENT v4.5.0 Creating separated containers for current and next tiles 3720 3721 ls.g.curTiles = $('<div>').addClass('ls-curtiles').appendTo( ls.g.ltContainer ); 3722 ls.g.nextTiles = $('<div>').addClass('ls-nexttiles').appendTo( ls.g.ltContainer ); 3723 } 3724 3725 var pn = ls.g.prevNext; 3726 3727 // Creating cuboids for 3d or tiles for 2d transition (cols * rows) 3728 3729 for(var tiles=0; tiles < cols * rows; tiles++){ 3730 3731 var rW = tiles%cols == 0 ? restW : 0; 3732 var rH = tiles > (rows-1)*cols-1 ? restH : 0; 3733 3734 var tile = $('<div>').addClass('ls-lt-tile').css({ 3735 width : Math.floor(tileWidth) + rW, 3736 height : Math.floor(tileHeight) + rH 3737 }).appendTo( ls.g.ltContainer ); 3738 3739 var curTile, nextTile; 3740 3741 // If current transition is a 3d transition 3742 3743 if( type == '3d' ){ 3744 3745 tile.addClass('ls-3d-container'); 3746 3747 var W = Math.floor(tileWidth) + rW; 3748 var H = Math.floor(tileHeight) + rH; 3749 var D; 3750 3751 if( prop.animation.direction == 'horizontal' ){ 3752 if( Math.abs(prop.animation.transition.rotateY) > 90 && prop.tile.depth != 'large' ){ 3753 D = Math.floor( W / 7 ) + rW; 3754 }else{ 3755 D = W; 3756 } 3757 }else{ 3758 if( Math.abs(prop.animation.transition.rotateX) > 90 && prop.tile.depth != 'large' ){ 3759 D = Math.floor( H / 7 ) + rH; 3760 }else{ 3761 D = H; 3762 } 3763 } 3764 3765 var W2 = W/2; 3766 var H2 = H/2; 3767 var D2 = D/2; 3768 3769 // createCuboids function will append cuboids with their style settings to their container 3770 3771 // BUGFIX v5.1.2 the prefixless transform must be the last property 3772 3773 var createCuboids = function(c,a,w,h,tx,ty,tz,rx,ry){ 3774 $('<div>').addClass(c).css({ 3775 width: w, 3776 height: h, 3777 '-o-transform': 'translate3d('+tx+'px, '+ty+'px, '+tz+'px) rotateX('+rx+'deg) rotateY('+ry+'deg) rotateZ(0deg) scale3d(1, 1, 1)', 3778 '-ms-transform': 'translate3d('+tx+'px, '+ty+'px, '+tz+'px) rotateX('+rx+'deg) rotateY('+ry+'deg) rotateZ(0deg) scale3d(1, 1, 1)', 3779 '-moz-transform': 'translate3d('+tx+'px, '+ty+'px, '+tz+'px) rotateX('+rx+'deg) rotateY('+ry+'deg) rotateZ(0deg) scale3d(1, 1, 1)', 3780 '-webkit-transform': 'translate3d('+tx+'px, '+ty+'px, '+tz+'px) rotateX('+rx+'deg) rotateY('+ry+'deg) rotateZ(0deg) scale3d(1, 1, 1)', 3781 'transform': 'translate3d('+tx+'px, '+ty+'px, '+tz+'px) rotateX('+rx+'deg) rotateY('+ry+'deg) rotateZ(0deg) scale3d(1, 1, 1)' 3782 }).appendTo(a); 3783 }; 3784 3785 createCuboids('ls-3d-box',tile,0,0,0,0,-D2,0,0); 3786 3787 var backRotX = 0 3788 var topRotX = 0 3789 var bottomRotX = 0 3790 3791 if( prop.animation.direction == 'vertical' && Math.abs(prop.animation.transition.rotateX) > 90){ 3792 createCuboids('ls-3d-back',tile.find('.ls-3d-box'),W,H,-W2,-H2,-D2,180,0); 3793 }else{ 3794 createCuboids('ls-3d-back',tile.find('.ls-3d-box'),W,H,-W2,-H2,-D2,0,180); 3795 } 3796 3797 createCuboids('ls-3d-bottom',tile.find('.ls-3d-box'),W,D,-W2,H2-D2,0,-90,0
3797); 3798 createCuboids('ls-3d-top',tile.find('.ls-3d-box'),W,D,-W2,-H2-D2,0,90,0); 3799 createCuboids('ls-3d-front',tile.find('.ls-3d-box'),W,H,-W2,-H2,D2,0,0); 3800 createCuboids('ls-3d-left',tile.find('.ls-3d-box'),D,H,-W2-D2,-H2,0,0,-90); 3801 createCuboids('ls-3d-right',tile.find('.ls-3d-box'),D,H,W2-D2,-H2,0,0,90); 3802 3803 curTile = tile.find('.ls-3d-front'); 3804 3805 if( prop.animation.direction == 'horizontal' ){ 3806 if( Math.abs(prop.animation.transition.rotateY) > 90 ){ 3807 nextTile = tile.find('.ls-3d-back'); 3808 }else{ 3809 nextTile = tile.find('.ls-3d-left, .ls-3d-right'); 3810 } 3811 }else{ 3812 if( Math.abs(prop.animation.transition.rotateX) > 90 ){ 3813 nextTile = tile.find('.ls-3d-back'); 3814 }else{ 3815 nextTile = tile.find('.ls-3d-top, .ls-3d-bottom'); 3816 } 3817 } 3818 3819 // Animating cuboids 3820 3821 var curCubDelay = tileSequence[tiles] * prop.tile.delay; 3822 3823 var curCub = ls.g.ltContainer.find('.ls-3d-container:eq('+tiles+') .ls-3d-box'); 3824 3825 var tl = new TimelineLite(); 3826 3827 if( prop.before && prop.before.transition ){ 3828 prop.before.transition.delay = prop.before.transition.delay ? (prop.before.transition.delay + curCubDelay)/1000 : curCubDelay/1000; 3829 tl.to( curCub[0],prop.before.duration/1000,lsConvertTransition( prop.before.transition, prop.before.easing )); 3830 }else{ 3831 prop.animation.transition.delay = prop.animation.transition.delay ? (prop.animation.transition.delay + curCubDelay)/1000 : curCubDelay/1000; 3832 } 3833 3834 tl.to( curCub[0],prop.animation.duration/1000,lsConvertTransition( prop.animation.transition, prop.animation.easing )); 3835 3836 if( prop.after ){ 3837 if( !prop.after.transition ){ 3838 prop.after.transition = {}; 3839 } 3840 tl.to( curCub[0],prop.after.duration/1000,lsConvertTransition( prop.after.transition, prop.after.easing, 'after' )); 3841 } 3842 3843 }else{ 3844 3845 // If current transition is a 2d transition 3846 3847 var T1 = L1 = T2 = L2 = 'auto'; 3848 var O1 = O2 = 1; 3849 3850 if( prop.transition.direction == 'random' ){ 3851 var dir = ['top','bottom','right','left']; 3852 var direction = dir[Math.floor(Math.random() * dir.length )]; 3853 }else{ 3854 var direction = prop.transition.direction; 3855 } 3856 3857 // IMPROVEMENT v4.5.0 Reversing animation directions if slider is moving backwards 3858 3859 if( prop.name.toLowerCase().indexOf('mirror') != -1 && tiles%2 == 0 ){ 3860 if( pn == 'prev' ){ 3861 pn = 'next'; 3862 }else{ 3863 pn = 'prev'; 3864 } 3865 } 3866 3867 if( pn == 'prev' ){ 3868 3869 switch( direction ){ 3870 case 'top': 3871 direction = 'bottom'; 3872 break; 3873 case 'bottom': 3874 direction = 'top'; 3875 break; 3876 case 'left': 3877 direction = 'right'; 3878 break; 3879 case 'right': 3880 direction = 'left'; 3881 break; 3882 case 'topleft': 3883 direction = 'bottomright'; 3884 break; 3885 case 'topright': 3886 direction = 'bottomleft'; 3887 break; 3888 case 'bottomleft': 3889 direction = 'topright'; 3890 break; 3891 case 'bottomright': 3892 direction = 'topleft'; 3893 break; 3894 } 3895 } 3896 3897 switch( direction ){ 3898 case 'top': 3899 T1 = T2 = -tile.height(); 3900 L1 = L2 = 0; 3901 break; 3902 case 'bottom': 3903 T1 = T2 = tile.height(); 3904 L1 = L2 = 0; 3905 break; 3906 case 'left': 3907 T1 = T2 = 0; 3908 L1 = L2 = -tile.width(); 3909 break; 3910 case 'right': 3911 T1 = T2 = 0; 3912 L1 = L2 = tile.width(); 3913 break; 3914 case 'topleft': 3915 T1 = tile.height(); 3916 T2 = 0; 3917 L1 = tile.width(); 3918 L2 = 0; 3919 break; 3920 case 'topright': 3921 T1 = tile.height(); 3922 T2 = 0; 3923 L1 = - tile.width(); 3924 L2 = 0; 3925 break; 3926 case 'bottomleft': 3927 T1 = - tile.height(); 3928 T2 = 0; 3929 L1 = tile.width(); 3930 L2 = 0; 3931 break; 3932 case 'bottomright': 3933 T1 = - tile.height(); 3934 T2 = 0; 3935 L1 = - tile.width(); 3936 L2 = 0; 3937 break; 3938 } 3939 3940 ls.g.scale2D = prop.transition.scale ? prop.transition.scale : 1; 3941 3942 if( carousel == true && ls.g.scale2D != 1 ){ 3943 3944 T1 = T1 / 2; 3945 T2 = T2 / 2; 3946 L1 = L1 / 2; 3947 L2 = L2 / 2; 3948 } 3949 3950 // Selecting the type of the transition 3951 3952// if( !ls.g.ie78 || ( ls.g.ie78 && !ls.o.optimizeForIE78 ) || ( ls.g.ie78 && ls.o.optimizeForIE78 == true && prop.name.toLowerCase().indexOf('crossfade') != -1 ) ){ 3953 switch( prop.transition.type ){ 3954 case 'fade': 3955 T1 = T2 = L1 = L2 = 0; 3956 O1 = 0; 3957 O2 = 1; 3958 break; 3959 case 'mixed': 3960 O1 = 0; 3961 O2 = 1; 3962 if( ls.g.scale2D == 1 ){ 3963 T2 = L2 = 0; 3964 } 3965 break; 3966 } 3967// } 3968 3969 // IMPROVEMENT v4.5.0 Implemented Rotation and Scale into 2D Transitions 3970 3971 if((( prop.transition.rotate || prop.transition.rotateX || prop.transition.rotateY ) || ls.g.scale2D != 1 ) && !ls.g.ie78 && prop.transition.type != 'slide' ){ 3972 tile.css({ 3973 overflow : 'visible' 3974 }); 3975 }else{ 3976 tile.css({ 3977 overflow : 'hidden' 3978 }); 3979 } 3980 3981 if( carousel == true){ 3982 ls.g.curTiles.css({ 3983 overflow: 'visible' 3984 }); 3985 }else{ 3986 ls.g.curTiles.css({ 3987 overflow: 'hidden' 3988 }); 3989 } 3990 3991 if( crossfade == true || prop.transition.type == 'slide' || carousel == true ){ 3992 var tileInCur = tile.appendTo( ls.g.curTiles ); 3993 var tileInNext = tile.clone().appendTo( ls.g.nextTiles ); 3994 curTile = $('<div>').addClass('ls-curtile').appendTo( tileInCur ); 3995 }else{ 3996 var tileInNext = tile.appendTo( ls.g.nextTiles ); 3997 } 3998 3999 nextTile = $('<div>').addClass('ls-nexttile').appendTo( tileInNext ).css({ 4000 top : -T1, 4001 left : -L1, 4002 dispay : 'block', 4003 opacity : O1 4004 }); 4005 4006 // Animating tiles 4007
4008 var curTileDelay = tileSequence[tiles] * prop.tile.delay; 4009 4010 // IMPROVEMENT v4.5.0 Implemented various types of rotations into 2D Transitions 4011 4012 var r = prop.transition.rotate ? prop.transition.rotate : 0; 4013 var rX = prop.transition.rotateX ? prop.transition.rotateX : 0; 4014 var rY = prop.transition.rotateY ? prop.transition.rotateY : 0; 4015 4016 // Reversing rotation degrees if slider is moving backwards 4017 4018 if( pn == 'prev' ){ 4019 r = -r; 4020 rX = -rX; 4021 rY = -rY; 4022 } 4023 4024 TweenLite.fromTo(nextTile[0],prop.transition.duration/1000,{ 4025 rotation : r, 4026 rotationX : rX, 4027 rotationY : rY, 4028 scale : ls.g.scale2D 4029 },{ 4030 delay : curTileDelay / 1000, 4031 top : 0, 4032 left : 0, 4033 opacity : O2, 4034 rotation : 0, 4035 rotationX : 0, 4036 rotationY : 0, 4037 scale : 1, 4038 ease : lsConvertEasing( prop.transition.easing ) 4039 }); 4040 4041 // IMPROVEMENT v5.0.0 Smart crossfading for semi-transparent PNG and different size JPG backgrounds 4042 4043 if( 4044 crossfade == true && ( 4045 nextBG.length < 1 || ( 4046 nextBG.length > 0 && ( 4047 nextBG.attr('src').toLowerCase().indexOf('png') != -1 || ( 4048 nextBG.width() < ls.g.sliderWidth() || nextBG.height() < ls.g.sliderHeight() 4049 ) 4050 ) 4051 ) 4052 ) 4053 ){ 4054 TweenLite.to(curTile[0],prop.transition.duration/1000,{ 4055 delay : curTileDelay / 1000, 4056 opacity : 0, 4057 ease : lsConvertEasing( prop.transition.easing ) 4058 }); 4059 } 4060 4061 if( ( prop.transition.type == 'slide' || carousel == true ) && prop.name.toLowerCase().indexOf('mirror') == -1 ){ 4062 4063 var r2 = 0; 4064 4065 if( r != 0 ){ 4066 r2 = -r; 4067 } 4068 4069 TweenLite.to(curTile[0],prop.transition.duration/1000,{ 4070 delay : curTileDelay / 1000, 4071 top : T2, 4072 left : L2, 4073 rotation : r2, 4074 scale : ls.g.scale2D, 4075 opacity: O1, 4076 ease : lsConvertEasing( prop.transition.easing ) 4077 }); 4078 } 4079 } 4080 4081 // Appending the background images of current and next layers into the tiles on both of 2d & 3d transitions 4082 // BUGFIX v5.0.0 added Math.floor to prevent '1px bug' under Safari and Firefox 4083 4084 if( curBG.length ){ 4085 if( type == '3d' || ( type == '2d' && ( crossfade == true || prop.transition.type == 'slide' || carousel == true ) ) ){ 4086 curTile.append($('<img>').attr('src', curBG.attr('src')).css({ 4087 width : curBG[0].style.width, 4088 height : curBG[0].style.height, 4089 marginLeft : parseFloat(curBG.css('margin-left')) - parseFloat(tile.position().left), 4090 marginTop : parseFloat(curBG.css('margin-top')) - parseFloat(tile.position().top) 4091 })); 4092 }else if( ls.g.curTiles.children().length == 0 ){ 4093 ls.g.curTiles.append($('<img>').attr('src', curBG.attr('src')).css({ 4094 width : curBG[0].style.width, 4095 height : curBG[0].style.height, 4096 marginLeft : parseFloat(curBG.css('margin-left')), 4097 marginTop : parseFloat(curBG.css('margin-top')) 4098 })); 4099 4100 } 4101 } 4102 4103 if( nextBG.length ){ 4104 nextTile.append( $('<img>').attr('src', nextBG.attr('src')).css({ 4105 width : nextBG[0].style.width, 4106 height : nextBG[0].style.height, 4107 marginLeft : parseFloat(nextBG.css('margin-left')) - parseFloat(tile.position().left), 4108 marginTop : parseFloat(nextBG.css('margin-top')) - parseFloat(tile.position().top) 4109 })); 4110 } 4111 } 4112 4113 // Storing current and next layer elements in a local variable (needed by setTimeout functions in some cases) 4114 4115 var curLayer = ls.g.curLayer; 4116 var nextLayer = ls.g.nextLayer; 4117 4118 // Hiding the background image of the current and next layers (immediately) 4119 4120 setTimeout(function(){ 4121 curLayer.find('.ls-bg').css({ 4122 visibility : 'hidden' 4123 }); 4124 },50); 4125 4126 nextLayer.find('.ls-bg').css({ 4127 visibility : 'hidden' 4128 }); 4129 ls.g.ltContainer.removeClass('ls-overflow-hidden'); 4130 4131 // Sliding out the sublayers of the current layer 4132 // (immediately, delay out and duration out properties are not applied to the sublayers during the new layer transitions) 4133 4134 curSubLayers(sublayersDurationOut); 4135 4136 // BUGFIX v5.2.0 prevents background flickering in some cases 4137 4138 if( sublayersDurationOut === 0 ){ 4139 sublayersDurationOut = 10; 4140 } 4141 4142 // Hiding current layer after its sublayers animated out 4143 4144 setTimeout(function(){ 4145 curLayer.css({ 4146 width: 0 4147 }); 4148 }, sublayersDurationOut ); 4149 4150 // Calculating next layer delay 4151 4152 var nextLayerTimeShift = parseInt(nextLayer.data('timeshift')) ? parseInt(nextLayer.data('timeshift')) : 0; 4153 var nextLayerDelay = ls.g.totalDuration + nextLayerTimeShift > 0 ? ls.g.totalDuration + nextLayerTimeShift : 0; 4154 4155 // Showing next layer and sliding sublayers of the next layer in after the current layer transition ended 4156 4157 setTimeout(function(){ 4158 if( ls.g.resize == true ){ 4159 ls.g.ltContainer.empty(); 4160 curLayer.removeClass('ls-active'); 4161 ls.makeResponsive( nextLayer, function(){ 4162 ls.g.resize = false;
4163 }); 4164 } 4165 4166 // Sliding in / fading in the sublayers of the next layer 4167 4168 nextSubLayers(); 4169 4170 // NEW FEATURE v4.6.0 Hiding background if the next layer has png BG or has no BG 4171 // BUGFIX v4.6.1 Changed some properties to prevent flickering 4172 4173 if( nextLayer.find('.ls-bg').length < 1 || ( nextLayer.find('.ls-bg').length > 0 && nextLayer.find('.ls-bg').attr('src').toLowerCase().indexOf('png') != -1 ) ){ 4174 4175 ls.g.ltContainer.delay(350).fadeOut(300,function(){ 4176 $(this).empty().show(); 4177 }); 4178 } 4179 4180 // Displaying the next layer (immediately) 4181 4182 nextLayer.css({ 4183 width : ls.g.sliderWidth(), 4184 height : ls.g.sliderHeight() 4185 }); 4186 }, nextLayerDelay ); 4187 4188 // BUGFIX v5.0.1 Added a minimal value of ls.g.totalDuration 4189 // CHANGED in v5.1.0 due to a fading issue in carousel transition 4190 4191 if( ls.g.totalDuration < 300 ){ 4192 ls.g.totalDuration = 1000; 4193 } 4194 4195 // Changing visibility to visible of the background image of the next layer and overflow to hidden of .ls-lt-container after the transition and calling callback function 4196 4197 setTimeout(function(){ 4198 ls.g.ltContainer.addClass('ls-overflow-hidden'); 4199 4200 nextLayer.addClass('ls-active'); 4201 4202 if( nextLayer.find('.ls-bg').length ){ 4203 4204 nextLayer.find('.ls-bg').css({ 4205 display : 'none', 4206 visibility : 'visible' 4207 }); 4208 if( ls.g.ie78 ){ 4209 nextLayer.find('.ls-bg').css('display','block'); 4210 setTimeout(function(){ 4211 curLayerCallback(); 4212 },500); 4213 }else{ 4214 nextLayer.find('.ls-bg').fadeIn(500, function(){ 4215 curLayerCallback(); 4216 }); 4217 } 4218 }else{ 4219 curLayerCallback(); 4220 } 4221 4222 }, ls.g.totalDuration ); 4223 }; 4224 4225 4226 4227 /* Selecting and running the transition */ 4228 4229 // NEW FEATURE v5.2.0 Starts the slider only if it is in the viewport 4230 4231 var startInViewport = function(){ 4232 4233 ls.g.nextLayer.find(' > *[class*="ls-l"]').each(function(){ 4234 4235 $(this).css({ 4236 visibility : 'hidden' 4237 }); 4238 }); 4239 4240 ls.g.sliderTop = $(el).offset().top; 4241 4242 $(window).load(function(){ 4243 setTimeout(function(){ 4244 4245 ls.g.sliderTop = $(el).offset().top; 4246 }, 20); 4247 }); 4248 4249 var isSliderInViewport = function(){ 4250 if( $(window).scrollTop() + $(window).height() - ( ls.g.sliderHeight() / 2 ) > ls.g.sliderTop ){ 4251 ls.g.firstSlideAnimated = true; 4252 if( ls.g.originalAutoStart === true ){ 4253 //ls.g.autoSlideshow = true; 4254 ls.o.autoStart = true; 4255 ls.start(); 4256 } 4257 nextSubLayers(); 4258 } 4259 } 4260 4261 $(window).scroll(function(){ 4262 if( !ls.g.firstSlideAnimated ){ 4263 isSliderInViewport(); 4264 } 4265 }); 4266 4267 isSliderInViewport(); 4268 }; 4269 4270 var tType = ( ( ls.g.nextLayer.data('transition3d') || ls.g.nextLayer.data('transition2d') ) && ls.t ) || ( ( ls.g.nextLayer.data('customtransition3d') || ls.g.nextLayer.data('customtransition2d') ) && ls.ct ) ? 'new' : 'old'; 4271 4272 if( !ls.g.nextLayer.data('transitiontype') ){ 4273 ls.transitionType( ls.g.nextLayer ); 4274 } 4275 4276 if( ls.g.nextLayer.data('transitiontype') === 'new' ){ 4277 tType = 'new'; 4278 } 4279 4280 if( ls.o.slideTransition ){ 4281 tType = 'forced'; 4282 } 4283 if( ls.o.animateFirstSlide && !ls.g.firstSlideAnimated ){ 4284 4285 // BUGFIX v3.5 there is no need to animate 'current' layer if the following conditions are true 4286 // this fixes the sublayer animation direction bug 4287 4288 if( ls.g.layersNum == 1 ){ 4289 var curDelay = 0; 4290 4291 // IMPROVEMENT v4.1.0 Calling cbAnimStop(); function if only one layer is in the slider 4292 4293 ls.o.cbAnimStop(ls.g); 4294 4295 }else{ 4296 var nextLayerTimeShift = parseInt(ls.g.nextLayer.data('timeshift')) ? parseInt(ls.g.nextLayer.data('timeshift')) : 0; 4297 var d = tType == 'new' ? 0 : curDuration; 4298 ls.g.t5 = setTimeout(function(){ 4299 curLayerCallback(); 4300 }, d + Math.abs(nextLayerTimeShift) ); 4301 } 4302 4303 // curDelay must be 0! 4304 4305 ls.g.totalDuration = true; 4306 4307 // Animating SUBLAYERS of the first layer 4308 4309 if( ls.o.startInViewport === true ){ 4310 4311 startInViewport(); 4312 }else{ 4313 4314 ls.g.firstSlideAnimated = true; 4315 nextSubLayers(); 4316 } 4317 4318 // Displaying the first layer (immediately) 4319 4320 ls.g.nextLayer.css({ 4321 width : ls.g.sliderWidth(), 4322 height : ls.g.sliderHeight() 4323 }); 4324 4325 if( !ls.g.ie78 ){ 4326 ls.g.nextLayer.find('.ls-bg').css({ 4327 display : 'none' 4328 }).fadeIn(ls.o.sliderFadeInDuration); 4329 } 4330 4331 ls.g.isLoading = false;
4332 }else{ 4333 4334 switch(tType){ 4335 4336 // Old transitions (sliding layers) 4337 4338 case 'old': 4339 4340 ls.g.totalDuration = false; 4341 4342 // BUGFIX v4.5.0 Removing elements from ls-lt-container is necessary 4343 4344 if( ls.g.ltContainer ){ 4345 ls.g.ltContainer.empty(); 4346 } 4347 4348 // Animating CURRENT LAYER and its SUBLAYERS 4349 4350 curLayer(); 4351 curSubLayers(); 4352 4353 // Animating NEXT LAYER and its SUBLAYERS 4354 4355 nextLayer(); 4356 nextSubLayers(); 4357 break; 4358 4359 // NEW FEATURE v4.0 2D & 3D Layer Transitions 4360 4361 case 'new': 4362 4363 if( typeof LSCustomTransition != 'undefined' ){ 4364 selectCustomTransition(); 4365 }else{ 4366 selectTransition(); 4367 } 4368 break; 4369 4370 case 'forced': 4371 slideTransition( ls.o.slideTransition.type, ls.o.slideTransition.obj ); 4372 break; 4373 } 4374 } 4375 }; 4376 4377 ls.transitionType = function( el ){ 4378 4379 var ttype = el.data('ls') || 4380 ( !el.data('ls') && 4381 !el.data('slidedelay') && 4382 !el.data('slidedirection') && 4383 !el.data('slideoutdirection') && 4384 !el.data('delayin') && 4385 !el.data('delayout') && 4386 !el.data('durationin') && 4387 !el.data('durationout') && 4388 !el.data('showuntil') && 4389 !el.data('easingin') && 4390 !el.data('easingout') && 4391 !el.data('scalein') && 4392 !el.data('scaleout') && 4393 !el.data('rotatein') && 4394 !el.data('rotateout') 4395 ) ? 'new' : 'old'; 4396 el.data('transitiontype', ttype); 4397 }; 4398 4399 ls.sublayerShowUntil = function( sublayer ){ 4400 4401 if( !sublayer.data('transitiontype') ){ 4402 ls.transitionType( sublayer ); 4403 } 4404 4405 // BUGFIX v5.1.0 Removing ls-videohack class before starting transition 4406 4407 sublayer.removeClass('ls-videohack'); 4408 4409 var prevOrNext = ls.g.curLayer; 4410 4411 if( ls.g.prevNext != 'prev' && ls.g.nextLayer ){ 4412 prevOrNext = ls.g.nextLayer; 4413 } 4414 4415 var chooseDirection = prevOrNext.data('slidedirection') ? prevOrNext.data('slidedirection') : ls.o.slideDirection; 4416 4417 // Setting the direction of sliding 4418 4419 var slideDirection = ls.g.slideDirections[ls.g.prevNext][chooseDirection]; 4420 4421 var curSubSlideDir = sublayer.data('slidedirection') ? sublayer.data('slidedirection') : slideDirection; 4422 var lml, lmt; 4423 4424 switch(curSubSlideDir){ 4425 case 'left': 4426 lml = -ls.g.sliderWidth(); 4427 lmt = 0; 4428 break; 4429 case 'right': 4430 lml = ls.g.sliderWidth(); 4431 lmt = 0; 4432 break; 4433 case 'top': 4434 lmt = -ls.g.sliderHeight(); 4435 lml = 0; 4436 break; 4437 case 'bottom': 4438 lmt = ls.g.sliderHeight(); 4439 lml = 0; 4440 break; 4441 case 'fade': 4442 lmt = 0; 4443 lml = 0; 4444 break; 4445 } 4446 4447 // NEW FEATURE v1.6 added slideoutdirection to sublayers 4448 // NEW FEATURES 5.0.0 added axis-free transitions with offsetx and offsety properties 4449 4450 if( sublayer.data('transitiontype') === 'new' ){ 4451 var curSubSlideOutDir = 'new'; 4452 }else{ 4453 var curSubSlideOutDir = sublayer.data('slideoutdirection') ? sublayer.data('slideoutdirection') : false; 4454 } 4455 4456 switch(curSubSlideOutDir){ 4457 case 'left': 4458 lml = ls.g.sliderWidth(); 4459 lmt = 0; 4460 break; 4461 case 'right': 4462 lml = -ls.g.sliderWidth(); 4463 lmt = 0; 4464 break; 4465 case 'top': 4466 lmt = ls.g.sliderHeight(); 4467 lml = 0; 4468 break; 4469 case 'bottom': 4470 lmt = -ls.g.sliderHeight(); 4471 lml = 0; 4472 break; 4473 case 'fade': 4474 lmt = 0; 4475 lml = 0; 4476 break; 4477 case 'new': 4478 if( sublayer.data('offsetxout') ){ 4479 if( sublayer.data('offsetxout') === 'left' ){ 4480 lml = ls.g.sliderWidth(); 4481 }else if( sublayer.data('offsetxout') === 'right' ){ 4482 lml = -ls.g.sliderWidth(); 4483 }else{ 4484 lml = -parseInt( sublayer.data('offsetxout') ); 4485 } 4486 }else{ 4487 lml = -ls.lt.offsetXOut; 4488 } 4489 if( sublayer.data('offsetyout') ){ 4490 if( sublayer.data('offsetyout') === 'top' ){ 4491 lmt = ls.g.sliderHeight(); 4492 }else if( sublayer.data('offsetyout') === 'bottom' ){ 4493 lmt = -ls.g.sliderHeight(); 4494 }else{ 4495 lmt = -parseInt( sublayer.data('offsetyout') ); 4496 } 4497 }else{ 4498 lmt = -ls.lt.offsetYOut; 4499 } 4500 break; 4501 } 4502 4503 // NEW FEATURE v4.5.0 Rotating & Scaling sublayers 4504 // BUGFIX v4.5.5 changing the default value from 0 to 'none' (because of old jQuery, 1.7.2) 4505 // NEW FEATURES v5.0.0 Added SkewX, SkewY, ScaleX, ScaleY, RotateX & RotateY transitions 4506 4507 var curSubRotate = curSubRotateX = curSubRotateY = curSubScale = curSubSkewX
4507= curSubSkewY = curSubScaleX = curSubScaleY = 'none'; 4508// if( !ls.g.ie78 && ls.g.enableCSS3 ){ 4509 curSubRotate = sublayer.data('rotateout') ? sublayer.data('rotateout') : ls.lt.rotateOut; 4510 curSubRotateX = sublayer.data('rotatexout') ? sublayer.data('rotatexout') : ls.lt.rotateXOut; 4511 curSubRotateY = sublayer.data('rotateyout') ? sublayer.data('rotateyout') : ls.lt.rotateYOut; 4512 curSubScale = sublayer.data('scaleout') ? sublayer.data('scaleout') : ls.lt.scaleOut; 4513 curSubSkewX = sublayer.data('skewxout') ? sublayer.data('skewxout') : ls.lt.skewXOut; 4514 curSubSkewY = sublayer.data('skewyout') ? sublayer.data('skewyout') : ls.lt.skewYOut; 4515 if( curSubScale === 1 ){ 4516 curSubScaleX = sublayer.data('scalexout') ? sublayer.data('scalexout') : ls.lt.scaleXOut; 4517 curSubScaleY = sublayer.data('scaleyout') ? sublayer.data('scaleyout') : ls.lt.scaleYOut; 4518 }else{ 4519 curSubScaleX = curSubScaleY = curSubScale; 4520 } 4521 var too = sublayer.data('transformoriginout') ? sublayer.data('transformoriginout').split(' ') : ls.lt.transformOriginOut; 4522 4523 for(var t =0;t<too.length;t++){ 4524 if( too[t].indexOf('%') === -1 && too[t].indexOf('left') !== -1 && too[t].indexOf('right') !== -1 && too[t].indexOf('top') !== -1 && too[t].indexOf('bottom') !== -1 ){ 4525 too[t] = '' + parseInt( too[t] ) * ls.g.ratio + 'px'; 4526 } 4527 } 4528 var curSubTransformOrigin = too.join(' '); 4529 var curSubPerspective = sublayer.data('perspectiveout') ? sublayer.data('perspectiveout') : ls.lt.perspectiveOut; 4530 4531// } 4532 4533 // IMPROVEMENT v4.0 Distance (P.level): -1 4534 4535 var endLeft = parseInt( sublayer.css('left') ); 4536 var endTop = parseInt( sublayer.css('top') ); 4537 4538 var curSubPLevel = parseInt( sublayer.attr('class').split('ls-l')[1] ); 4539 4540 var wh = sublayer.outerWidth() > sublayer.outerHeight() ? sublayer.outerWidth() : sublayer.outerHeight(); 4541 var modX = parseInt( curSubRotate ) === 0 ? sublayer.outerWidth() : wh; 4542 var modY = parseInt( curSubRotate ) === 0 ? sublayer.outerHeight() : wh; 4543 4544 if( ( curSubPLevel === -1 && curSubSlideOutDir !== 'new' ) || ( sublayer.data('offsetxout') === 'left' || sublayer.data('offsetxout') === 'right' ) ){ 4545 if( lml < 0 ){ 4546 lml = - ( ls.g.sliderWidth() - endLeft + ( curSubScaleX / 2 - .5 ) * modX + 100 ); 4547 }else if( lml > 0 ){ 4548 lml = endLeft + ( curSubScaleX / 2 + .5 ) * modX + 100; 4549 } 4550 }else{ 4551 lml = lml * ls.g.ratio; 4552 } 4553 4554 if( ( curSubPLevel === -1 && curSubSlideOutDir !== 'new' ) || ( sublayer.data('offsetyout') === 'top' || sublayer.data('offsetyout') === 'bottom' ) ){ 4555 if( lmt < 0 ){ 4556 lmt = - ( ls.g.sliderHeight() - endTop + ( curSubScaleY / 2 - .5 ) * modY + 100 ); 4557 }else if( lmt > 0 ){ 4558 lmt = endTop + ( curSubScaleY / 2 + .5 ) * modY + 100; 4559 } 4560 }else{ 4561 lmt = lmt * ls.g.ratio; 4562 } 4563 4564 if( curSubPLevel === -1 || curSubSlideOutDir === 'new' ){ 4565 var curSubPar = 1; 4566 }else{ 4567 var curSubParMod = ls.g.curLayer.data('parallaxout') ? parseInt(ls.g.curLayer.data('parallaxout')) : ls.o.parallaxOut; 4568 var curSubPar = curSubPLevel * curSubParMod; 4569 } 4570 4571// var curSubDelay = parseInt( sublayer.data('showuntil') ); 4572 4573 if( sublayer.data('transitiontype') === 'new' ){ 4574 var duO = ls.lt.durationOut; 4575 var eO = ls.lt.easingOut; 4576 }else{ 4577 var duO = ls.o.durationOut; 4578 var eO = ls.o.easingOut; 4579 } 4580 4581 var curSubTime = sublayer.data('durationout') ? parseInt(sublayer.data('durationout')) : duO; 4582 4583 // BUGFIX v5.2.0 duration cannot be 0 4584 4585 if( curSubTime === 0 ){ curSubTime = 1 } 4586 var curSubEasing = sublayer.data('easingout') ? sublayer.data('easingout') : eO; 4587 4588 var css = { 4589 visibility : 'hidden' 4590 }; 4591 4592 var transition = { 4593 rotation : curSubRotate, 4594 rotationX : curSubRotateX, 4595 rotationY : curSubRotateY, 4596 skewX : curSubSkewX, 4597 skewY : curSubSkewY, 4598 scaleX : curSubScaleX, 4599 scaleY : curSubScaleY, 4600 x : -lml * curSubPar, 4601 y : -lmt * curSubPar, 4602 ease : lsConvertEasing( curSubEasing ), 4603 onComplete : function(){ 4604 sublayer.css( css ); 4605 } 4606 }; 4607 4608 if( curSubSlideOutDir == 'fade' || ( !curSubSlideOutDir && curSubSlideDir == 'fade' ) || ( sublayer.data('fadeout') !== 'false' && sublayer.data('transitiontype') === 'new' ) ){ 4609 transition['opacity'] = 0; 4610 css['opacity'] = sublayer.data( 'originalOpacity' ); 4611 } 4612 4613 TweenLite.set( sublayer[0],{ 4614 transformPerspective : curSubPerspective, 4615 transformOrigin : curSubTransformOrigin 4616 }); 4617 4618 TweenLite.to(sublayer[0],curSubTime/1000,transition); 4619
4620 // sublayer.stop(true,false).animate( transition, curSubTime, curSubEasing,function(){ 4621 // sublayer.css( css ); 4622 // }); 4623 }; 4624 4625 // v3.6 Improved Debug Mode 4626 4627// ls.debug = function(){ 4628 4629// ls.d = { 4630// history : $('<div>'), 4631// // adds a H1 (title) 4632// aT : function(content){ 4633// $('<h1>'+content+'</h1>').appendTo( ls.d.history ); 4634// }, 4635// // adds an empty UL 4636// aeU : function(){ 4637// $('<ul>').appendTo( ls.d.history ); 4638// }, 4639// // adds an UL with a LI 4640// aU : function(content){ 4641// $('<ul><li>'+content+'</li></ul>').appendTo( ls.d.history ); 4642// }, 4643// // adds a LI into the last UL 4644// aL : function(content){ 4645// $('<li>'+content+'</li>').appendTo( ls.d.history.find('ul:last') ); 4646// }, 4647// // adds an UL into the last LI of the last UL 4648// aUU : function(content){ 4649// $('<ul>').appendTo( ls.d.history.find('ul:last li:last') ); 4650// }, 4651// // adds a Function to the first LI inside the last UL 4652// aF : function(elem){ 4653// ls.d.history.find('ul:last li:last').hover( 4654// function(){ 4655// elem.css({ 4656// border: '2px solid red', 4657// marginTop : parseInt( elem.css('margin-top') ) - 2, 4658// marginLeft : parseInt( elem.css('margin-left') ) - 2 4659// }); 4660// }, 4661// function(){ 4662// elem.css({ 4663// border: '0px', 4664// marginTop : parseInt( elem.css('margin-top') ) + 2, 4665// marginLeft : parseInt( elem.css('margin-left') ) + 2 4666// }); 4667// } 4668// ); 4669// }, 4670// show : function(){ 4671// if( !$('body').find('.ls-debug-console').length ){ 4672 4673// if( !ls.d.putData ){ 4674 4675// // Init code 4676 4677// ls.d.aT('Init code'); 4678// ls.d.aeU(); 4679 4680// for( var prop in ls.o ){ 4681// ls.d.aL(prop+': <strong>' + ls.o[prop] + '</strong>'); 4682// } 4683 4684// // ls.d.aL('sliderOriginalWidth: <strong>' + ls.g.sliderOriginalWidth + '</strong>'); 4685// // ls.d.aL('sliderOriginalHeight: <strong>' + ls.g.sliderOriginalHeight + '</strong>'); 4686 4687// // Slides, layers data 4688 4689// ls.d.aT('LayerSlider Content'); 4690// ls.d.aU('Number of slides found: <strong>' + $(el).find('.ls-slide').length + '</strong>'); 4691 4692// $(el).find('.ls-inner .ls-slide, .ls-inner *[class*="ls-l"]').each(function(){ 4693 4694// if( $(this).hasClass('ls-slide') ){ 4695// ls.d.aU('<strong>SLIDE ' + ( $(this).index() + 1 ) + '</strong>'); 4696// ls.d.aUU(); 4697// ls.d.aL('<strong>SLIDE ' + ( $(this).index() + 1 ) + ' properties:</strong><br><br>'); 4698// }else{ 4699// ls.d.aU(' Layer ( '+$(this).prop('tagName')+' )'); 4700// ls.d.aF($(this)); 4701// ls.d.aUU(); 4702// ls.d.aL('<strong>'+$(this).prop('tagName')+' layer properties:</strong><br><br>'); 4703// ls.d.aL('distance / class: <strong>'+$(this).attr('class')+'</strong>'); 4704// } 4705 4706// $.each( $(this).data(),function(name, val) { 4707// ls.d.aL( name +': <strong>' + val + '</strong>'); 4708// }); 4709// }); 4710 4711// ls.d.putData = true; 4712// } 4713 4714// var dc = $('<div>').addClass('ls-debug-console').css({ 4715// position: 'fixed', 4716// zIndex: '10000000000', 4717// top: '10px', 4718// right: '10px', 4719// width: '300px', 4720// padding: '20px', 4721// background: 'black', 4722// 'border-radius': '10px', 4723// height: $(window).height() - 60, 4724// opacity: 0, 4725// marginRight: 150 4726// }).appendTo( $('body') ).css({ 4727// marginRight: 0, 4728// opacity: .9 4729// }).click(function(e){ 4730// if(e.shiftKey && e.altKey){ 4731// $(this).remove(); 4732// } 4733// }); 4734// var ds = $('<div>').css({ 4735// width: '100%', 4736// height: '100%', 4737// overflow: 'auto' 4738// }).appendTo( dc ); 4739// var dd = $('<div>').css({ 4740// width: '100%' 4741// }).appendTo( ds ).append( ls.d.history ); 4742// } 4743// }, 4744// hide : function(){ 4745// $('body').find('.ls-debug-console').remove(); 4746// } 4747// }; 4748 4749// $(el).click(function(e){ 4750// if(e.shiftKey && e.altKey){ 4751// ls.d.show(); 4752// } 4753// }); 4754// }; 4755 4756 // initializing 4757 ls.load(); 4758 }; 4759 4760 var lsConvertEasing = function( e ){ 4761 4762 var t; 4763 4764 if( e.toLowerCase().indexOf('swing') !== -1 || e.toLowerCase().indexOf('linear') !== -1 ){ 4765 t = Linear.easeNone; 4766 }else if( e.toLowerCase().indexOf('easeinout') !== -1 ){ 4767 var ee = e.toLowerCase().split('easeinout')[1]; 4768 t = window[ee.charAt(0).toUpperCase() + ee.slice(1)].easeInOut; 4769 }else if( e.toLowerCase().indexOf('easeout') !== -1 ){ 4770 var ee = e.toLowerCase().split('easeout')[1]; 4771 t = window[ee.charAt(0).toUpperCase() + ee.slice(1)].easeOut; 4772 }else if( e.toLowerCase().indexOf('easein') !== -1 ){ 4773 var ee = e.toLowerCase().split('easein')[1]; 4774 t = window[ee.charAt(0).toUpperCase() + ee.slice(1)].easeIn; 4775 } 4776 4777 return t; 4778 }; 4779 4780 var lsConvertTransition = function( t, e, type, undef ){ 4781 4782 if( typeof e === 'undefined' ){ 4783 var e = 'easeInOutQuart'; 4784 } 4785 var tt = {}; 4786 4787 if( t.rotate !== undef ){ 4788 tt.rotation = t.rotate; 4789 } 4790 if( t.rotateY !== undef ){ 4791 tt.rotationY = t.rotateY; 4792 } 4793 if( t.rotateX !== undef ){ 4794 tt.rotationX = t.rotateX; 4795 } 4796 if( type === 'after' ){ 4797 tt.scaleX = tt.scaleY = tt.scaleZ = 1; 4798 }else if( t.scale3d !== undef ){ 4799 tt.scaleX = tt.scaleY = tt.scaleZ = t.scale3d; 4800 } 4801 4802 if( t.delay ){ 4803 tt.delay = type === 'after' ? t.delay/1000 : t.delay; 4804 } 4805 4806 tt.ease = lsConvertEasing( e ); 4807 4808 return tt; 4809 }; 4810 4811 // Support3D checks the CSS3 3D capability of the browser (based on the idea of Modernizr.js) 4812 4813 var lsSupport3D = function( el ) { 4814
4815 var testEl = $('<div>'), 4816 s3d1 = false, 4817 s3d2 = false, 4818 properties = ['perspective', 'OPerspective', 'msPerspective', 'MozPerspective', 'WebkitPerspective']; 4819 transform = ['transformStyle','OTransformStyle','msTransformStyle','MozTransformStyle','WebkitTransformStyle']; 4820 4821 for (var i = properties.length - 1; i >= 0; i--){ 4822 s3d1 = s3d1 ? s3d1 : testEl[0].style[properties[i]] != undefined; 4823 }; 4824 4825 // preserve 3D test 4826 4827 for (var i = transform.length - 1; i >= 0; i--){ 4828 testEl.css( 'transform-style', 'preserve-3d' ); 4829 s3d2 = s3d2 ? s3d2 : testEl[0].style[transform[i]] == 'preserve-3d'; 4830 }; 4831 4832 // If browser has perspective capability and it is webkit, we must check it with this solution because Chrome can give false positive result if GPU acceleration is disabled 4833 4834 if (s3d1 && testEl[0].style[properties[4]] != undefined){ 4835 testEl.attr('id','ls-test3d').appendTo( el ); 4836 s3d1 = testEl[0].offsetHeight === 3 && testEl[0].offsetLeft === 9; 4837 testEl.remove(); 4838 } 4839 4840 return (s3d1 && s3d2); 4841 }; 4842 4843 // Order array function 4844 4845 var lsOrderArray = function(x,y,dir) { 4846 var i = []; 4847 if(dir=='forward'){ 4848 for( var a=0; a<x;a++){ 4849 for( var b=0; b<y; b++){ 4850 i.push(a+b*x); 4851 } 4852 } 4853 }else{ 4854 for( var a=x-1; a>-1;a--){ 4855 for( var b=y-1; b>-1; b--){ 4856 i.push(a+b*x); 4857 } 4858 } 4859 } 4860 return i; 4861 }; 4862 4863 // CountProp counts the properties in an object 4864 4865 var lsCountProp = function(obj) { 4866 var count = 0; 4867 4868 for(var prop in obj) { 4869 if(obj.hasOwnProperty(prop)){ 4870 ++count; 4871 } 4872 } 4873 return count; 4874 }; 4875 4876 // We need the browser function (removed from jQuery 1.9) 4877 4878 var lsBrowser = function(){ 4879 4880 uaMatch = function( ua ) { 4881 ua = ua.toLowerCase(); 4882 4883 var match = /(chrome)[ \/]([\w.]+)/.exec( ua ) || 4884 /(webkit)[ \/]([\w.]+)/.exec( ua ) || 4885 /(opera)(?:.*version|)[ \/]([\w.]+)/.exec( ua ) || 4886 /(msie) ([\w.]+)/.exec( ua ) || 4887 ua.indexOf("compatible") < 0 && /(mozilla)(?:.*? rv:([\w.]+)|)/.exec( ua ) || 4888 []; 4889 4890 return { 4891 browser: match[ 1 ] || "", 4892 version: match[ 2 ] || "0" 4893 }; 4894 }; 4895 4896 var matched = uaMatch( navigator.userAgent ), browser = {}; 4897 4898 if ( matched.browser ) { 4899 browser[ matched.browser ] = true; 4900 browser.version = matched.version; 4901 } 4902 4903 if ( browser.chrome ) { 4904 browser.webkit = true; 4905 } else if ( browser.webkit ) { 4906 browser.safari = true; 4907 } 4908 4909 return browser; 4910 }; 4911 4912 lsPrefixes = function(obj, method){ 4913 4914 var pfx = ['webkit', 'khtml', 'moz', 'ms', 'o', '']; 4915 var p = 0, m, t; 4916 while (p < pfx.length && !obj[m]) { 4917 m = method; 4918 if (pfx[p] == '') { 4919 m = m.substr(0,1).toLowerCase() + m.substr(1); 4920 } 4921 m = pfx[p] + m; 4922 t = typeof obj[m]; 4923 if (t != 'undefined') { 4924 pfx = [pfx[p]]; 4925 return (t == 'function' ? obj[m]() : obj[m]); 4926 } 4927 p++; 4928 } 4929 }; 4930 4931 // Global parameters (Do not change these settings!) 4932 4933 layerSlider.global = { 4934 4935 version : '5.3.0', 4936 4937 isMobile : function(){ 4938 if( navigator.userAgent.match(/Android/i) || navigator.userAgent.match(/webOS/i) || navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i) || navigator.userAgent.match(/iPod/i) || navigator.userAgent.match(/BlackBerry/i) || navigator.userAgent.match(/Windows Phone/i) ){ 4939 return true; 4940 }else{ 4941 return false; 4942 } 4943 }, 4944 isHideOn3D : function(el){ 4945 if( el.css('padding-bottom') == 'auto' || el.css('padding-bottom') == 'none' || el.css('padding-bottom') == 0 || el.css('padding-bottom') == '0px' ){ 4946 return true; 4947 }else{ 4948 return false; 4949 } 4950 }, 4951 4952 ie78 : lsBrowser().msie && lsBrowser().version < 9 ? true : false, 4953 originalAutoStart : false, 4954 paused : false, 4955 pausedByVideo : false, 4956 autoSlideshow : false, 4957 isAnimating : false, 4958 layersNum : null, 4959 prevNext : 'next', 4960 slideTimer : null, 4961 sliderWidth : null, 4962 sliderHeight : null, 4963 slideDirections : { 4964 prev : { 4965 left : 'right', 4966 right : 'left', 4967 top : 'bottom', 4968 bottom : 'top' 4969 }, 4970 next : { 4971 left : 'left', 4972 right : 'right', 4973 top : 'top', 4974 bottom : 'bottom' 4975 } 4976 }, 4977 4978 // Default delay time, fadeout and fadein durations of videoPreview images 4979 4980 v : { 4981 d : 500, 4982 fo : 750, 4983 fi : 500 4984 } 4985 }; 4986 4987 // Layer Transition Defaults 4988 4989 layerSlider.layerTransitions = { 4990 4991 offsetXIn : 80, 4992 offsetYIn : 0, 4993 durationIn : 1000, 4994 delayIn : 0, 4995 easingIn : 'easeInOutQuint', 4996 fadeIn : true, 4997 rotateIn : 0, 4998 rotateXIn : 0, 4999 rotateYIn : 0, 5000 scaleIn : 1, 5001 scaleXIn : 1, 5002 scaleYIn : 1, 5003 skewXIn : 0, 5004 skewYIn : 0, 5005 transformOriginIn : ['50%','50%','0'], 5006 perspectiveIn : 500, 5007 5008 offsetXOut : -80, 5009 offsetYOut : 0, 5010 durationOut : 400, 5011 showUntil : 0, 5012 easingOut : 'easeInOutQuint', 5013 fadeOut : true, 5014 rotateOut : 0, 5015 rotateXOut : 0, 5016 rotateYOut : 0, 5017 scaleOut : 1, 5018 scaleXOut : 1, 5019 scaleYOut : 1, 5020 skewXOut : 0, 5021 skewYOut : 0, 5022 transformOriginOut : ['50%','50%','0'], 5023 perspectiveOut : 500 5024 }; 5025 5026 layerSlider.slideTransitions = { 5027 5028 slideDelay : 4000 // Time before the next slide will be loading. 5029 }; 5030 5031 // Global settings (can be modified) 5032 5033 layerSlider.options = { 5034 5035 // Layout 5036 5037 responsive : true, 5038 responsiveUnder : 0, 5039 layersContainer : 0, 5040 fullScreen : false, // NEW FEATURE 5.5.0 5041 appendTo : '', // NEW FEATURE 5.5.0 5042 5043 // Slideshow 5044 5045 autoStart : true, 5046 startInViewport : true, // NEW FEATURE v5.2.0 5047 pauseOnHover : true, 5048 firstSlide : 1, 5049 animateFirstSlide : true, 5050 sliderFadeInDuration: 350, // NEW FEATURE v5.2.0 5051 loops : 0, 5052 forceLoopNum : true, 5053 twoWaySlideshow : false, 5054 randomSlideshow : false, 5055 5056 // Appearance 5057 5058 skin : 'v5', 5059 skinsPath : '/layerslider/skins/', 5060 globalBGColor : 'transparent', 5061 globalBGImage : false, 5062 5063 // Navigation Area 5064 5065 navPrevNext : true, 5066 navStartStop : true, 5067 navButtons : true, 5068 keybNav : true, 5069 touchNav : true, 5070 hoverPrevNext : true, 5071 hoverBottomNav : false, 5072 showBarTimer : false, 5073 showCircleTimer : true, 5074 5075 // Thumbnail navigation 5076 5077 thumbnailNavigation : 'hover', 5078 tnContainerWidth : '60%', 5079 tnWidth : 100, 5080 tnHeight : 60, 5081 tnActiveOpacity : 35, 5082 tnInactiveOpacity : 100, 5083 5084 // Videos 5085 5086 autoPlayVideos : true, 5087 autoPauseSlideshow : 'auto', 5088 youtubePreview : 'maxresdefault.jpg', 5089 5090 // Preload 5091 5092 imgPreload : true, 5093 lazyLoad : true, 5094 5095 // YourLogo 5096 5097 yourLogo : false, 5098 yourLogoStyle : 'left: -10px; top: -10px;', 5099 yourLogoLink : false, 5100 yourLogoTarget : '_self', 5101 5102 // Optimize for IE7 and IE8 5103 5104 optimizeForMobile : true, 5105 optimizeForIE78 : true, 5106 5107 // NEW FEATURES 5.2.0 Mobile features 5108 5109 hideOnMobile : false, 5110 hideUnder : 0, 5111 hideOver : 1000000, 5112 5113 staticImage : '', // will be available in 5.5.0 5114 5115 // API functions 5116 5117 cbInit : function(element){}, 5118 cbStart : function(data){}, 5119 cbStop : function(data){}, 5120 cbPause : function(data){}, 5121 cbAnimStart : function(data){}, 5122 cbAnimStop : function(data){}, 5123 cbPrev : function(data){}, 5124 cbNext : function(data){}, 5125 5126 // !!! IMPORTANT !!! The following properties are deprecated from version 5.0.0 DO NOT USE THEM. 5127 // The slider will recognize these properties in the init code or if you add these properties into the style attribute of the layer 5128 // but we recommend you to use to new html5 data attribute (data-ls) with the new properties 5129 5130 slideDelay : 4000, 5131 slideDirection : 'right', 5132 parallaxIn : .45, 5133 parallaxOut : .45, 5134 durationIn : 1000, 5135 durationOut : 1000, 5136 easingIn : 'easeInOutQuint', 5137 easingOut : 'easeInOutQuint', 5138 delayIn : 0, 5139 delayOut : 0 5140 }; 5141 5142})(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.