NAVIGATION
This shows you the differences between two versions of the page.
deutsch:phpwcms-system:artikel:contentparts:bilder-spezial:lof-slidernews [2011/05/16 17:23] Knut Heermann (flip-flop) |
deutsch:phpwcms-system:artikel:contentparts:bilder-spezial:lof-slidernews [2018/06/03 18:08] (current) |
||
---|---|---|---|
Line 1: | Line 1: | ||
{{indexmenu_n>10}} | {{indexmenu_n>10}} | ||
- | ====== Lof SliderNews ====== | + | ====== Lof SliderNews (jQuery) ====== |
+ | |||
+ | **Lof SliderNews 1.0 - Jquery 1.3 & Easing plugin** -> [[http://landofcoder.com/our-porfolios/jquery-plugins/item/10-the-lof-jsidernews-plugin.html|The Lof JSiderNews Plugin]] | ||
+ | |||
+ | **JQuery Plugin für die Darstellung von Bildern mit zugehörigem Text.** | ||
+ | |||
+ | **Richtung:** Rechts - Links. | ||
+ | |||
+ | **JS Bibliothek:** In der Vorlage mindestens ##jQuery 1.4## einstellen. | ||
+ | |||
+ | **Die Navigation:** | ||
+ | * ist eine Liste aus Zahlen //(1 2 3 4 5 ...)//. | ||
+ | * besteht aus Knöpfen an der linken und rechten Seite. | ||
+ | * ist eine Liste aus kleinen Vorschaubildern //(Thumbnails)//. | ||
+ | |||
+ | Das Plugin erlaubt den Einsatz des Mausrades für die Auswahl des vorherigen|nächsten Bildes. | ||
+ | |||
+ | * Die Reihenfolge der Bilder wird im CP festgelegt. | ||
+ | * Die Anzeige der Bilder in der Serie kann mit einer manuellen Navigation oder Automatik gesteuert werden. | ||
+ | * Als Bildwechselfunktion können "Bilder horizontal schieben" oder "Opazität" gewählt werden. | ||
+ | |||
+ | **CP:** Bilder spezial | ||
+ | |||
+ | |||
+ | ---- | ||
+ | \\ | ||
+ | [[deutsch/phpwcms-system/artikel/contentparts/bilder-spezial/lof-slidernews/nav-list-1-2-3|{{deutsch:phpwcms-system:artikel:contentparts:bilder-spezial:lof-slidernews:fe_image_special_opacity01_1.gif?260 }}]] | ||
+ | [[deutsch/phpwcms-system/artikel/contentparts/bilder-spezial/lof-slidernews/nav-buttons-left-right|{{deutsch:phpwcms-system:artikel:contentparts:bilder-spezial:lof-slidernews:fe_image_special_opacity03_1.gif?265 }}]] | ||
+ | [[deutsch/phpwcms-system/artikel/contentparts/bilder-spezial/lof-slidernews/nav-list-of-thumbnails|{{deutsch:phpwcms-system:artikel:contentparts:bilder-spezial:lof-slidernews:fe_image_special_opacity02_1.gif?260 }}]] | ||
+ | |||
+ | |||
+ | ~~CLEARFLOAT~~ | ||
+ | |||
+ | \\ | ||
+ | ---- | ||
+ | Docu: -- \\ | ||
+ | Forum: [[ttp://forum.phpwcms.org/viewtopic.php?f=1&t=20941|LofSlider and LofSliderNews - both new since 1.4.7 r410]] | ||
+ | |||
+ | |||
+ | **Idee und Basis:** [[http://landofcoder.com/our-porfolios/jquery-plugins/item/10-the-lof-jsidernews-plugin.html| The Lof JSiderNews Plugin]] \\ | ||
+ | **Adaptiert:** O.Georgi http://phpwcms.de \\ | ||
+ | **Erweitert:** K.Heermann (flip-flop) http://planmatrix.de //2011/05/03 // \\ | ||
+ | **CMS version:** >= V1.4.7 r410\\ | ||
+ | **Version:** V1.0 \\ | ||
+ | **Update:** -- | ||
+ | |||
+ | **Tag:** -- \\ | ||
+ | |||
+ | **Bedingung:** -> [[http://www.phpwcms-docu.de/confincphp_de.phtml|/config/phpwcms/conf.inc.php]] | ||
+ | * $phpwcms['allow_cntPHP_rt'] = 1; | ||
+ | * phpwcms['allow_ext_init'] = 0; | ||
+ | |||
+ | ---- | ||
+ | ---- | ||
+ | \\ | ||
+ | |||
+ | ===== Für alle folgenden jQuery Varianten: ===== | ||
+ | |||
+ | * [[deutsch/phpwcms-system/artikel/contentparts/bilder-spezial/lof-slidernews/nav-list-1-2-3]] | ||
+ | * [[deutsch/phpwcms-system/artikel/contentparts/bilder-spezial/lof-slidernews/nav-buttons-left-right]] | ||
+ | * [[deutsch/phpwcms-system/artikel/contentparts/bilder-spezial/lof-slidernews/nav-list-of-thumbnails]] | ||
+ | |||
+ | \\ | ||
+ | |||
+ | ==== CSS: ==== | ||
+ | |||
+ | **Datei:** template/lib/lofslider/css/lofslider-style01.css | ||
+ | |||
+ | |||
+ | <code css|h lofslider-style01.css |h> | ||
+ | .lof-slidecontent { | ||
+ | position:relative; | ||
+ | overflow:hidden; | ||
+ | /* border:#F4F4F4 solid 1px; */ | ||
+ | width:450px; | ||
+ | height:350px; | ||
+ | } | ||
+ | .lof-slidecontent .preload { | ||
+ | height:100%; | ||
+ | width:100%; | ||
+ | background:#FFF; | ||
+ | position:absolute; | ||
+ | top:0; | ||
+ | left:0; | ||
+ | z-index:100000; | ||
+ | color:#FFF; | ||
+ | text-align:center | ||
+ | } | ||
+ | .lof-slidecontent .preload div { | ||
+ | height:100%; | ||
+ | width:100%; | ||
+ | background:transparent url(../images/load-indicator.gif) no-repeat scroll 50% 50%; | ||
+ | position:relative; | ||
+ | } | ||
+ | .lof-main-outer{ | ||
+ | position:relative; | ||
+ | height:100%; | ||
+ | width:450px; | ||
+ | z-index:3px; | ||
+ | overflow:hidden; | ||
+ | } | ||
+ | |||
+ | /*******************************************************/ | ||
+ | .lof-main-item-desc{ | ||
+ | z-index:100px; | ||
+ | position:absolute; | ||
+ | bottom:10px; | ||
+ | left:0px; | ||
+ | width:450px; | ||
+ | /* height:100px; */ | ||
+ | background:url(../images/transparent_bg.png); | ||
+ | /* filter:0.7(opacity:60) */ | ||
+ | padding:2px; | ||
+ | color:#aaa; | ||
+ | } | ||
+ | |||
+ | .lof-main-item-desc b { | ||
+ | font-size: 110%; | ||
+ | color: #009bff; | ||
+ | } | ||
+ | |||
+ | .lof-main-item-desc h3 { | ||
+ | color:#DDD; | ||
+ | margin:0; | ||
+ | font-size:140%; | ||
+ | padding:0px 8px 2px; | ||
+ | font-family:"Trebuchet MS", Trebuchet, Arial, Verdana, sans-serif; | ||
+ | } | ||
+ | .lof-main-item-desc a, .lof-main-item-desc a:link,.lof-main-item-desc a:visited { | ||
+ | font-size:110%; | ||
+ | /* padding:15px 16px 2px; */ | ||
+ | } | ||
+ | |||
+ | } | ||
+ | .lof-main-item-desc h3 a { | ||
+ | color:#FFF; | ||
+ | margin:0; | ||
+ | |||
+ | font-family:"Trebuchet MS", Trebuchet, Arial, Verdana, sans-serif; | ||
+ | } | ||
+ | .lof-main-item-desc h3 a:hover { | ||
+ | color:#FF6; | ||
+ | text-decoration:underline; | ||
+ | } | ||
+ | |||
+ | .lof-main-item-desc p{ | ||
+ | margin:0 0 0 10px; | ||
+ | padding:5px 0 0 5px; | ||
+ | line-height: 16px; | ||
+ | } | ||
+ | .lof-main-item-desc strong { | ||
+ | margin:0; | ||
+ | padding:0; | ||
+ | font-size:120%; | ||
+ | color:#eee; | ||
+ | } | ||
+ | |||
+ | /* main flash */ | ||
+ | ul.lof-main-wapper { | ||
+ | overflow:hidden; | ||
+ | background:transparent url(../images/load-indicator.gif) no-repeat scroll 50% 50%; | ||
+ | padding:0px; | ||
+ | margin:0; | ||
+ | height:345px; | ||
+ | width:450px; | ||
+ | position:absolute; | ||
+ | overflow:hidden; | ||
+ | } | ||
+ | ul.lof-main-wapper li { | ||
+ | overflow:hidden; | ||
+ | padding:0px; | ||
+ | margin:0px; | ||
+ | height:100%; | ||
+ | width:450px; | ||
+ | float:left; | ||
+ | position:relative; | ||
+ | } | ||
+ | |||
+ | .lof-opacity { | ||
+ | overflow:visible !important;; | ||
+ | position:absolute !important; | ||
+ | } | ||
+ | .lof-opacity li{ | ||
+ | position:absolute !important;; | ||
+ | top:0; | ||
+ | left:0; | ||
+ | float:inherit !important; | ||
+ | } | ||
+ | ul.lof-main-wapper li img { | ||
+ | padding:0px; | ||
+ | width:450px; | ||
+ | } | ||
+ | /* Desc text */ | ||
+ | li-desc { | ||
+ | z-index:100; | ||
+ | position:absolute; | ||
+ | top:150px; | ||
+ | left:50px; | ||
+ | width:400px; | ||
+ | background:url(../images/transparent_bg.png); | ||
+ | } | ||
+ | li-desc p { | ||
+ | color:#FFF; | ||
+ | margin:0 8px; | ||
+ | padding:8px 0 | ||
+ | } | ||
+ | li-desc h3 a { | ||
+ | color:#FFF; | ||
+ | margin:0; | ||
+ | font-size:140%; | ||
+ | padding:20px 8px 2px; | ||
+ | font-family:"Trebuchet MS", Trebuchet, Arial, Verdana, sans-serif; | ||
+ | } | ||
+ | li-desc h3 a:hover { | ||
+ | color:#FF6; | ||
+ | text-decoration:underline; | ||
+ | } | ||
+ | |||
+ | /* item navigator */ | ||
+ | .lof-navigator-wapper { | ||
+ | position:absolute; | ||
+ | top:10px; | ||
+ | right:10px; | ||
+ | background:#000; | ||
+ | padding:5px 15px; | ||
+ | -moz-border-radius:5px 5px 5px 5px; | ||
+ | |||
+ | } | ||
+ | .lof-navigator-outer{ | ||
+ | position:relative; | ||
+ | z-index:100; | ||
+ | height:180px; | ||
+ | width:310px; | ||
+ | overflow:hidden; | ||
+ | color:#FFF; | ||
+ | float:left | ||
+ | } | ||
+ | ul.lof-navigator{ | ||
+ | top:0; | ||
+ | padding:0; | ||
+ | margin:0; | ||
+ | position:absolute; | ||
+ | width:100%; | ||
+ | } | ||
+ | ul.lof-navigator li{ | ||
+ | cursor:hand; | ||
+ | cursor:pointer; | ||
+ | list-style:none; | ||
+ | padding:0; | ||
+ | margin-left:0px; | ||
+ | overflow:hidden; | ||
+ | float:left; | ||
+ | display:block; | ||
+ | text-align:center; | ||
+ | |||
+ | } | ||
+ | ul.lof-navigator li.active , ul.lof-navigator li:hover { | ||
+ | /* background:#FFF; */ | ||
+ | color:#000; | ||
+ | display:block; | ||
+ | } | ||
+ | |||
+ | ul.lof-navigator li img{ | ||
+ | border:#666 solid 3px; | ||
+ | } | ||
+ | ul.lof-navigator li.active img, ul.lof-navigator li:hover img { | ||
+ | border:#A8A8A8 solid 3px; | ||
+ | } | ||
+ | .lof-navigator-wapper .lof-next, .lof-navigator-wapper .lof-previous{ | ||
+ | display:block; | ||
+ | width:22px; | ||
+ | height:30px; | ||
+ | color:#FFF; | ||
+ | cursor:pointer; | ||
+ | |||
+ | } | ||
+ | .lof-navigator-wapper .lof-next { | ||
+ | float:left; | ||
+ | text-indent:-999px; | ||
+ | margin-right:5px; | ||
+ | background:url(../images/arrow-l.png) no-repeat right center; | ||
+ | } | ||
+ | .lof-navigator-wapper .lof-previous { | ||
+ | float:left; | ||
+ | text-indent:-999px; | ||
+ | margin-left:5px; | ||
+ | background:url(../images/arrow-r.png) no-repeat left center; | ||
+ | } | ||
+ | |||
+ | /* Demo 6 Right/LEft button */ | ||
+ | .lof-main-outer .lof-next, .lof-main-outer .lof-previous{ | ||
+ | display:block; | ||
+ | width:40px; | ||
+ | color:#FFF; | ||
+ | cursor:pointer; | ||
+ | position:absolute; | ||
+ | height:100%; | ||
+ | z-index:3; | ||
+ | top:0; | ||
+ | text-indent:-999px; | ||
+ | } | ||
+ | |||
+ | .lof-main-outer .lof-next { | ||
+ | right:05px; | ||
+ | background:url(../images/b_next.png) no-repeat right center; | ||
+ | } | ||
+ | .lof-main-outer .lof-previous { | ||
+ | left:05px; | ||
+ | background:url(../images/b_prev.png) no-repeat left center; | ||
+ | } | ||
+ | </code> | ||
+ | |||
+ | \\ | ||
+ | |||
+ | ==== JavaScript: ==== | ||
+ | |||
+ | **Datei:** template/lib/lofslider/lofslider01.js | ||
+ | |||
+ | <code js|h lofslider01.js |h> | ||
+ | /** | ||
+ | * LofSliderNews | ||
+ | * Copyright (c) JAN 2010 LandOfCoder.com <@emai:landofcoder@gmail.com>. All rights reserved. | ||
+ | * This plugin is dual-licensed under the GNU General Public License and the MIT License | ||
+ | * http://landofcoder.com/our-porfolios/jquery-plugins/item/10-the-lof-jsidernews-plugin.html | ||
+ | */ | ||
+ | // JavaScript Document | ||
+ | (function($) { | ||
+ | $.fn.lofJSidernews = function( settings ) { | ||
+ | return this.each(function() { | ||
+ | // get instance of the lofSiderNew. | ||
+ | new $.lofSidernews( this, settings ); | ||
+ | }); | ||
+ | } | ||
+ | $.lofSidernews = function( obj, settings ){ | ||
+ | this.settings = { | ||
+ | direction : '', | ||
+ | mainItemSelector : 'li', | ||
+ | navInnerSelector : 'ul', | ||
+ | navSelector : 'li' , | ||
+ | navigatorEvent : 'click', | ||
+ | wapperSelector: '.lof-main-wapper', | ||
+ | interval : 4000, | ||
+ | auto : true, // whether to automatic play the slideshow | ||
+ | maxItemDisplay : 3, | ||
+ | startItem : 0, | ||
+ | navPosition : 'vertical', | ||
+ | navigatorHeight : 100, | ||
+ | navigatorWidth : 310, | ||
+ | duration : 600, | ||
+ | navItemsSelector : '.lof-navigator li', | ||
+ | navOuterSelector : '.lof-navigator-outer' , | ||
+ | isPreloaded : true, | ||
+ | easing : 'easeInOutQuad', | ||
+ | mainItemDesc : '.lof-main-item-desc' // if set, smooth output of Desc text in direction mode = "opacity" +KH 08.05.11 | ||
+ | } | ||
+ | $.extend( this.settings, settings ||{} ); | ||
+ | this.nextNo = null; | ||
+ | this.previousNo = null; | ||
+ | this.maxWidth = this.settings.mainWidth || 600; | ||
+ | this.wrapper = $( obj ).find( this.settings.wapperSelector ); | ||
+ | this.slides = this.wrapper.find( this.settings.mainItemSelector ); | ||
+ | if( !this.wrapper.length || !this.slides.length ) return ; | ||
+ | // set width of wapper | ||
+ | if( this.settings.maxItemDisplay > this.slides.length ){ | ||
+ | this.settings.maxItemDisplay = this.slides.length; | ||
+ | } | ||
+ | this.currentNo = isNaN(this.settings.startItem)||this.settings.startItem > this.slides.length?0:this.settings.startItem; | ||
+ | this.navigatorOuter = $( obj ).find( this.settings.navOuterSelector ); | ||
+ | this.navigatorItems = $( obj ).find( this.settings.navItemsSelector ) ; | ||
+ | this.navigatorInner = this.navigatorOuter.find( this.settings.navInnerSelector ); | ||
+ | |||
+ | if( this.settings.navPosition == 'horizontal' ){ | ||
+ | this.navigatorInner.width( this.slides.length * this.settings.navigatorWidth ); | ||
+ | this.navigatorOuter.width( this.settings.maxItemDisplay * this.settings.navigatorWidth ); | ||
+ | this.navigatorOuter.height( this.settings.navigatorHeight ); | ||
+ | |||
+ | } else { | ||
+ | this.navigatorInner.height( this.slides.length * this.settings.navigatorHeight ); | ||
+ | |||
+ | this.navigatorOuter.height( this.settings.maxItemDisplay * this.settings.navigatorHeight ); | ||
+ | this.navigatorOuter.width( this.settings.navigatorWidth ); | ||
+ | } | ||
+ | this.navigratorStep = this.__getPositionMode( this.settings.navPosition ); | ||
+ | this.directionMode = this.__getDirectionMode(); | ||
+ | |||
+ | |||
+ | if( this.settings.direction == 'opacity') { | ||
+ | this.wrapper.addClass( 'lof-opacity' ); | ||
+ | $(this.slides).css('opacity',0).eq(this.currentNo).css('opacity',1); // Rolling back to the beginning when the end is reached | ||
+ | // this.caption = $( obj ).find( '.lof-main-item-desc' ); | ||
+ | // $( obj ).find( '.lof-main-item-desc' ).hide().eq(0).show(); | ||
+ | this.caption = $( obj ).find( this.settings.mainItemDesc ); | ||
+ | $( obj ).find( this.settings.mainItemDesc ).hide().eq(0).show(); | ||
+ | } else { | ||
+ | this.wrapper.css({'left':'-'+this.currentNo*this.maxSize+'px', 'width':( this.maxWidth ) * this.slides.length } ); | ||
+ | } | ||
+ | |||
+ | |||
+ | if( this.settings.isPreloaded ) { | ||
+ | this.preLoadImage( this.onComplete ); | ||
+ | } else { | ||
+ | this.onComplete(); | ||
+ | } | ||
+ | |||
+ | } | ||
+ | $.lofSidernews.fn = $.lofSidernews.prototype; | ||
+ | $.lofSidernews.fn.extend = $.lofSidernews.extend = $.extend; | ||
+ | |||
+ | $.lofSidernews.fn.extend({ | ||
+ | |||
+ | startUp:function( obj, wrapper ) { | ||
+ | seft = this; | ||
+ | |||
+ | this.navigatorItems.each( function(index, item ){ | ||
+ | $(item).click( function(){ | ||
+ | seft.jumping( index, true ); | ||
+ | seft.setNavActive( index, item ); | ||
+ | } ); | ||
+ | $(item).css( {'height': seft.settings.navigatorHeight, 'width': seft.settings.navigatorWidth} ); | ||
+ | }) | ||
+ | this.registerWheelHandler( this.navigatorOuter, this ); | ||
+ | this.setNavActive(this.currentNo ); | ||
+ | |||
+ | if( this.settings.buttons && typeof (this.settings.buttons) == "object" ){ | ||
+ | this.registerButtonsControl( 'click', this.settings.buttons, this ); | ||
+ | } | ||
+ | if( this.settings.auto ) | ||
+ | this.play( this.settings.interval,'next', true ); | ||
+ | |||
+ | return this; | ||
+ | }, | ||
+ | onComplete:function(){ | ||
+ | setTimeout( function(){ $('.preload').fadeOut( 900 ); }, 400 ); this.startUp( ); | ||
+ | }, | ||
+ | preLoadImage:function( callback ){ | ||
+ | var self = this; | ||
+ | var images = this.wrapper.find( 'img' ); | ||
+ | |||
+ | var count = 0; | ||
+ | images.each( function(index,image){ | ||
+ | if( !image.complete ){ | ||
+ | image.onload =function(){ | ||
+ | count++; | ||
+ | if( count >= images.length ){ | ||
+ | self.onComplete(); | ||
+ | } | ||
+ | } | ||
+ | image.onerror =function(){ | ||
+ | count++; | ||
+ | if( count >= images.length ){ | ||
+ | self.onComplete(); | ||
+ | } | ||
+ | } | ||
+ | }else { | ||
+ | count++; | ||
+ | if( count >= images.length ){ | ||
+ | self.onComplete(); | ||
+ | } | ||
+ | } | ||
+ | } ); | ||
+ | }, | ||
+ | navivationAnimate:function( currentIndex ) { | ||
+ | if (currentIndex <= this.settings.startItem | ||
+ | || currentIndex - this.settings.startItem >= this.settings.maxItemDisplay-1) { | ||
+ | this.settings.startItem = currentIndex - this.settings.maxItemDisplay+2; | ||
+ | if (this.settings.startItem < 0) this.settings.startItem = 0; | ||
+ | if (this.settings.startItem >this.slides.length-this.settings.maxItemDisplay) { | ||
+ | this.settings.startItem = this.slides.length-this.settings.maxItemDisplay; | ||
+ | } | ||
+ | } | ||
+ | this.navigatorInner.stop().animate( eval('({'+this.navigratorStep[0]+':-'+this.settings.startItem*this.navigratorStep[1]+'})'), | ||
+ | {duration:500, easing:'easeInOutQuad'} ); | ||
+ | }, | ||
+ | setNavActive:function( index, item ){ | ||
+ | if( (this.navigatorItems) ){ | ||
+ | this.navigatorItems.removeClass( 'active' ); | ||
+ | $(this.navigatorItems.get(index)).addClass( 'active' ); | ||
+ | this.navivationAnimate( this.currentNo ); | ||
+ | } | ||
+ | }, | ||
+ | __getPositionMode:function( position ){ | ||
+ | if( position == 'horizontal' ){ | ||
+ | return ['left', this.settings.navigatorWidth]; | ||
+ | } | ||
+ | return ['top', this.settings.navigatorHeight]; | ||
+ | }, | ||
+ | __getDirectionMode:function(){ | ||
+ | switch( this.settings.direction ){ | ||
+ | case 'opacity': this.maxSize=0; return ['opacity','opacity']; | ||
+ | default: this.maxSize=this.maxWidth; return ['left','width']; | ||
+ | } | ||
+ | }, | ||
+ | registerWheelHandler:function( element, obj ){ | ||
+ | element.bind('mousewheel', function(event, delta ) { | ||
+ | var dir = delta > 0 ? 'Up' : 'Down', | ||
+ | vel = Math.abs(delta); | ||
+ | if( delta > 0 ){ | ||
+ | obj.previous( true ); | ||
+ | } else { | ||
+ | obj.next( true ); | ||
+ | } | ||
+ | return false; | ||
+ | }); | ||
+ | }, | ||
+ | registerButtonsControl:function( eventHandler, objects, self ){ | ||
+ | for( var action in objects ){ | ||
+ | switch (action.toString() ){ | ||
+ | case 'next': | ||
+ | objects[action].click( function() { self.next( true) } ); | ||
+ | break; | ||
+ | case 'previous': | ||
+ | objects[action].click( function() { self.previous( true) } ); | ||
+ | break; | ||
+ | } | ||
+ | } | ||
+ | return this; | ||
+ | }, | ||
+ | onProcessing:function( manual, start, end ){ | ||
+ | this.previousNo = this.currentNo + (this.currentNo>0 ? -1 : this.slides.length-1); | ||
+ | this.nextNo = this.currentNo + (this.currentNo < this.slides.length-1 ? 1 : 1- this.slides.length); | ||
+ | return this; | ||
+ | }, | ||
+ | finishFx:function( manual ){ | ||
+ | if( manual ) this.stop(); | ||
+ | if( manual && this.settings.auto ){ | ||
+ | this.play( this.settings.interval,'next', true ); | ||
+ | } | ||
+ | this.setNavActive( this.currentNo ); | ||
+ | }, | ||
+ | getObjectDirection:function( start, end ){ | ||
+ | return eval("({'"+this.directionMode[0]+"':-"+(this.currentNo*start)+"})"); | ||
+ | }, | ||
+ | fxStart:function( index, obj, currentObj ){ | ||
+ | if( this.settings.direction == 'opacity' ) { | ||
+ | $(this.slides).stop().animate({opacity:0}, {duration: this.settings.duration, easing:this.settings.easing} ); | ||
+ | $(this.slides).eq(index).stop().animate( {opacity:1},this.settings.duration, this.settings.easing, function(){ | ||
+ | $(currentObj.caption.slideUp().eq(index)).slideDown(); | ||
+ | } ); | ||
+ | |||
+ | }else { | ||
+ | this.wrapper.stop().animate( obj, {duration: this.settings.duration, easing:this.settings.easing} ); | ||
+ | } | ||
+ | return this; | ||
+ | }, | ||
+ | jumping:function( no, manual ){ | ||
+ | this.stop(); | ||
+ | if( this.currentNo == no ) return; | ||
+ | var obj = eval("({'"+this.directionMode[0]+"':-"+(this.maxSize*no)+"})"); | ||
+ | this.onProcessing( null, manual, 0, this.maxSize ) | ||
+ | .fxStart( no, obj, this ) | ||
+ | .finishFx( manual ); | ||
+ | this.currentNo = no; | ||
+ | }, | ||
+ | next:function( manual , item){ | ||
+ | |||
+ | this.currentNo += (this.currentNo < this.slides.length-1) ? 1 : (1 - this.slides.length); | ||
+ | this.onProcessing( item, manual, 0, this.maxSize ) | ||
+ | .fxStart( this.currentNo, this.getObjectDirection(this.maxSize ), this ) | ||
+ | .finishFx( manual ); | ||
+ | }, | ||
+ | previous:function( manual, item ){ | ||
+ | this.currentNo += this.currentNo > 0 ? -1 : this.slides.length - 1; | ||
+ | this.onProcessing( item, manual ) | ||
+ | .fxStart( this.currentNo, this.getObjectDirection(this.maxSize ), this ) | ||
+ | .finishFx( manual ); | ||
+ | }, | ||
+ | play:function( delay, direction, wait ){ | ||
+ | this.stop(); | ||
+ | if(!wait){ this[direction](false); } | ||
+ | var self = this; | ||
+ | this.isRun = setTimeout(function() { self[direction](true); }, delay); | ||
+ | }, | ||
+ | stop:function(){ | ||
+ | if (this.isRun == null) return; | ||
+ | clearTimeout(this.isRun); | ||
+ | this.isRun = null; | ||
+ | } | ||
+ | }) | ||
+ | })(jQuery) | ||
+ | |||
+ | </code> | ||
+ | |||
+ | \\ | ||
+ | |||
+ | |||
- | Lof SliderNews 1.0 - Jquery 1.3 & Easing plugin | ||
\\ | \\ |