tutorials.de Buch-Aktion 05/2012
Like Tree1Danke
  • 1 Beitrag von CPoly
ERLEDIGT
JA
ANTWORTEN
4
ZUGRIFFE
517
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. #1
    plux plux ist offline Grünschnabel
    Registriert seit
    Nov 2011
    Beiträge
    3
    Hallo,

    ich verwende das script: jquery.innerfade.js, um Bilder zu faden. Kann mir jemand verraten, wie ich das script dazu bekomme, dass es beim letzten Bild stehenbleibt - also nicht wieder beim ersten beginnt ?

    danke, mfg
     

  2. #2
    CPoly CPoly ist offline Mitglied Weizenbier
    tutorials.de Premium-User
    Registriert seit
    Sep 2009
    Beiträge
    2.445
    Setz einfach die Option "loop" auf false.


    loop: Whether to keep looping after the slideshow has gone through once (Default: true),
    https://github.com/wesbaker/jquery.innerFade
     

  3. #3
    plux plux ist offline Grünschnabel
    Registriert seit
    Nov 2011
    Beiträge
    3
    loop kommt in dem script nicht vor.

    PHP-Code:
    (function($) {

        $.
    fn.innerfade = function(options) {
            return 
    this.each(function() {   
                $.
    innerfade(thisoptions);
            });
        };

        $.
    innerfade = function(containeroptions) {
            var 
    settings = {
                    
    'animationtype':    'fade',
                
    'speed':            'normal',
                
    'type':             'sequence',
                
    'timeout':          2000,
                
    'containerheight':  'auto',
                
    'runningclass':     'innerfade',
                
    'children':         null
            
    };
            if (
    options)
                $.
    extend(settingsoptions);
            if (
    settings.children === null)
                var 
    elements = $(container).children();
            else
                var 
    elements = $(container).children(settings.children);
            if (
    elements.length 1) {
                $(
    container).css('position''relative').css('height'settings.containerheight).addClass(settings.runningclass);
                for (var 
    0elements.lengthi++) {
                    $(
    elements[i]).css('z-index'String(elements.length-i)).css('position''absolute').hide();
                };
                if (
    settings.type == "sequence") {
                    
    setTimeout(function() {
                        $.
    innerfade.next(elementssettings10);
                    }, 
    settings.timeout);
                    $(
    elements[0]).show();
                } else if (
    settings.type == "random") {
                        var 
    last Math.floor Math.random () * ( elements.length ) );
                    
    setTimeout(function() {
                        do { 
                                                    
    current Math.floor Math.random ( ) * ( elements.length ) );
                                            } while (
    last == current );             
                                            $.
    innerfade.next(elementssettingscurrentlast);
                    }, 
    settings.timeout);
                    $(
    elements[last]).show();
                            } else if ( 
    settings.type == 'random_start' ) {
                                    
    settings.type 'sequence';
                                    var 
    current Math.floor Math.random () * ( elements.length ) );
                                    
    setTimeout(function(){
                                        $.
    innerfade.next(elementssettings, (current 1) %  elements.lengthcurrent);
                                    }, 
    settings.timeout);
                                    $(
    elements[current]).show();
                            }    else {
                                
    alert('Innerfade-Type must either be \'sequence\', \'random\' or \'random_start\'');
                            }
                    }
        };

        $.
    innerfade.next = function(elementssettingscurrentlast) {
            if (
    settings.animationtype == 'slide') {
                $(
    elements[last]).slideUp(settings.speed);
                $(
    elements[current]).slideDown(settings.speed);
            } else if (
    settings.animationtype == 'fade') {
                $(
    elements[last]).fadeOut(settings.speed);
                $(
    elements[current]).fadeIn(settings.speed, function() {
                                
    removeFilter($(this)[0]);
                            });
            } else
                
    alert('Innerfade-animationtype must either be \'slide\' or \'fade\'');
            if (
    settings.type == "sequence") {
                if ((
    current 1) < elements.length) {
                    
    current current 1;
                    
    last current 1;
                } else {
                    
    current 0;
                    
    last elements.length 1;
                }
            } else if (
    settings.type == "random") {
                
    last current;
                while (
    current == last)
                    
    current Math.floor(Math.random() * elements.length);
            } else
                
    alert('Innerfade-Type must either be \'sequence\', \'random\' or \'random_start\'');
            
    setTimeout((function() {
                $.
    innerfade.next(elementssettingscurrentlast);
            }), 
    settings.timeout);
        };

    })(
    jQuery);

    // **** remove Opacity-Filter in ie ****
    function removeFilter(element) {
        if(
    element.style.removeAttribute){
            
    element.style.removeAttribute('filter');
        }

     

  4. #4
    CPoly CPoly ist offline Mitglied Weizenbier
    tutorials.de Premium-User
    Registriert seit
    Sep 2009
    Beiträge
    2.445
    Ich weiß ja nicht wo du es her hast, oder welches du genau benutzt. Es scheint ja mehrere zu geben.

    Du kannst dir das ja ganz einfach selbst einbauen. Ich habe die innerfade.next-Funktion angepasst.

    Code javascript:
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    
    $.innerfade.next = function (elements, settings, current, last) {
            var stop = false;
     
            if (settings.animationtype == 'slide') {
                $(elements[last]).slideUp(settings.speed);
                $(elements[current]).slideDown(settings.speed);
            } else if (settings.animationtype == 'fade') {
                $(elements[last]).fadeOut(settings.speed);
                $(elements[current]).fadeIn(settings.speed, function () {
                    removeFilter($(this)[0]);
                });
            } else alert('Innerfade-animationtype must either be \'slide\' or \'fade\'');
            if (settings.type == "sequence") {
                if ((current + 1) < elements.length) {
                    current = current + 1;
                    last = current - 1;
                } else {
                    stop = true;
                }
            } else if (settings.type == "random") {
                last = current;
                while (current == last)
                current = Math.floor(Math.random() * elements.length);
            } else alert('Innerfade-Type must either be \'sequence\', \'random\' or \'random_start\'');
     
            if(!stop) {
                setTimeout((function () {
                    $.innerfade.next(elements, settings, current, last);
                }), settings.timeout);
            }
        };


    Ich musste nur ganz wenig ändern, aber ich habe den Code nicht getestet. Im Anhang siehst du die geänderten Zeilen.
    Miniaturansicht angehängter Grafiken Miniaturansicht angehängter Grafiken jquery.innerfade kein loop-screenshot-1.png  
    plux bedankt sich. 

  5. #5
    plux plux ist offline Grünschnabel
    Registriert seit
    Nov 2011
    Beiträge
    3
    Perfekt! Funktioniert auf Anhieb

    danke.
     

Ähnliche Themen

  1. jquery geschachtelter Loop
    Von Netzwerkidi im Forum Javascript & Ajax
    Antworten: 2
    Letzter Beitrag: 07.11.11, 20:41
  2. Antworten: 12
    Letzter Beitrag: 05.08.11, 07:33
  3. JQuery getJSON loop
    Von Netzwerkidi im Forum Javascript & Ajax
    Antworten: 8
    Letzter Beitrag: 21.01.11, 11:02
  4. jQuery sendet kein Post/keine Daten
    Von ChrisMunich im Forum Javascript & Ajax
    Antworten: 4
    Letzter Beitrag: 11.07.10, 20:11
  5. Kein Loop
    Von aciddesigns_de im Forum Flash Plattform
    Antworten: 1
    Letzter Beitrag: 04.07.06, 00:52

Stichworte