Stop bei mouseover auf einem simplen jquery slider

Ich habe ein real simple jquery slider, es passt gut für meinen Gebrauch.
Nur verlinkte Bilder, keine Kontrollen, Daumen, nichts, wirklich einfach!

Ich versuche, es zu machen, stoo, während sich die Maus über es, aber ich war nicht in der Lage.
Kann mir jemand helfen hier?

slider.js

function slideSwitch()
    {
        var $active = $('#slideshow a.active');
        if ( $active.length == 0 ) $active = $('#slideshow a:last');
        var $next =  $active.next().length ? $active.next()
        : $('#slideshow a:first');

        $active.addClass('last-active');

        $next.css({opacity: 0.0})
        .addClass('active')
        .animate({opacity: 1.0}, 1000, function()
        {
            $active.removeClass('active last-active');
        });
}
$(function()
{
    setInterval( "slideSwitch()", 10000 );
});

Schieberegler.css

#slideshow { height: 300px; position: relative; width: 960px; }
#slideshow a { left: 0; opacity: 0.0; position: absolute; top: 0; z-index: 8; }
#slideshow a.active { opacity: 1.0; z-index:10; }
#slideshow a.last-active { z-index: 9; }

HTML

    <div id="slideshow">
        <a href="#" class="active"><img src="img/slideshow/slide1.png" alt="Engine - Development Solutions" /></a>
        <a href="#"><img src="img/slideshow/slide2.png" alt="Engine - Development Solutions" /></a>
        <a href="#"><img src="img/slideshow/slide3.png" alt="Engine - Development Solutions" /></a>
    </div>

DANK!

Herzlich willkommen auf Stack Overflow. Können Sie beschreiben, was passiert, wenn Sie nicht in der Lage waren?

InformationsquelleAutor kaue-porte | 2013-08-19

  1. 5

    Werden Sie wollen, deaktivieren Sie das Intervall auf mouseenter und starten Sie dann den Schieberegler wieder auf mouseleave. Sie können die jQuery - hover() Funktion als Abkürzung:

    funktionsfähige Demo

    $(function() {
    var interval = setInterval( slideSwitch, 10000 );

    $('#slideshow').hover(function() {
        clearInterval(interval);
    }, function() {
        interval = setInterval( slideSwitch, 10000 );
    });
});
    Funktioniert Prima! Danke!
    Super!!! Gerne helfen! Da dies beantwortet deine Frage, würde Sie Kennzeichnen, dass Sie akzeptiert? Das wird den Menschen helfen, die eine ähnliche Frage die richtige Antwort. Vielen Dank und viel Glück!
    Fertig! Ich danke Ihnen sehr!

    InformationsquelleAutor cfs

  2. 1

    DEMO

    VERSUCHEN, diese, Sie auf schweben, wird es anhalten und auf die Maus verlassen, wird es beginnen, die Zeit angehalten wurde, nicht von Anfang an

    function slideSwitch()
    {
        var $active = $('#slideshow a.active');
        if ( $active.length == 0 ) $active = $('#slideshow a:last');
        var $next =  $active.next().length ? $active.next()
        : $('#slideshow a:first');

        $active.addClass('last-active');

        $next.css({opacity: 0.0})
        .addClass('active')
        .animate({opacity: 1.0}, 1000, function()
        {
            $active.removeClass('active last-active');
        });
}


$(function()
{  var a;
    var  timer =  setInterval( "slideSwitch()",5000);
 $("#slideshow a img").hover(function(ev){
     a= 5000-timer;                      //finding the time lapsed
    clearInterval(timer);
}, function(ev){
    timer =  setInterval( "slideSwitch()",a);   //resume from the time paused
});

    Hoffe, das hilft,Danke

    Arbeitete wie ein Charme! Awsome! Ich danke Ihnen sehr!
    Eine Sache, nach ein paar Momenten mit der Seite geöffnet, der Schieber Stern komisch zu benehmen, Bilder flackern, ändert sich zu schnell, immer ein komplett Masse. Gibt es dafür einen Grund? o.O

    InformationsquelleAutor SarathSprakash

Schreibe einen Kommentar