JQuery: animation wiederholen, während Element angeglickt wird

[julesxxx]

Hey, ich beschäftige mich seit ein paar Tagen mit JQuery,
bis jetzt läuft eigentlich auch alles bestens.

Zum Problem:
Ich programmier gerade eine Galerie, die in etwa so aussehen soll: Dynamic Drive DHTML Scripts- CMotion Image Gallery
Nur mit dem kleinen unterschied, dass sich die Bilder verschieben sollen, wenn ich auf einen Button klicke.
Bis jetzt klappt das nur, dass sich die Bilder um z.B. 50px verschieben.
Ich möchte das so haben, dass sich die Bilder, so lange man auf den button klickt verschieben.
Ich hoffe mein Problem ist irgendwie verständlich...
Könnt ihr mir da helfen?

Mein Ansatz bis jetzt:
Der HTML-code

<div id="galleryWrapper" style="overflow:hidden; height: 380px; width:100%; position: relative;">
    	   <div id="button_layer">
        	   <img id="prev_label" src="gal_prev.png"/>
        	   <img id="next_label" src="gal_next.png"/>
        	   <div class="clear"></div>
    	   </div>
           <div id="gallery" style="margin-left: 0px; white-space: nowrap; position: absolute; top: 0px;">
                 <img  src="bild1.jpg" height="380px"/> usw...

           </div>
        </div>

Und der betroffene JQuery-Code:

	$("#prev_label").click(function()
        {
                $("#gallery")
                .animate({
                    "marginLeft": "+=50"
                },100, "swing");
        })

        $("#next_label").click(function()
        {
                 $("#gallery")
                    .animate({
                        "marginLeft": "-=50"
                    },100, "swing");

        })

Wenn man also klickt wird MarginLeft des gallery-containers erhöht/erniedrigt..

Danke

 

[timmeythe1st]

AW: JQuery: animation wiederholen, während Element angeglickt wird

ich habe jetzt auf die schnelle keine passenden jquery-codes da, aber ein ansatz kann ich versuchen dir zu vermitteln:
du müsstest nicht, wie dus bisher gemacht hast, das ereignis "click" ansprechen, sonder das ereignis "onmousedown", wobei in einer schleife dann immer wieder das verschieben aufgerufen werden soll
und bei dem ereignis "onmouseup" soll dieser vorgang unterbrochen werden.

 

[julesxxx]

AW: JQuery: animation wiederholen, während Element angeglickt wird

kann ich dann eine while-schleife
mit mousedown bedingung benutzen,
oder wie kann man in JQuery schleifen realisieren?

 

[Doitsu]

AW: JQuery: animation wiederholen, während Element angeglickt wird

Na ja, bei 'onmousedown' machst du halt ganz normal deine .animate - bei onmouseup benutzt du halt .stop?
evtl. dann auch noch ein setInterval & clearInterval einbauen - damit sich die Animation immer wiederholt (oder die Pixel Anzahl ziemlich hoch setzen - wuerde aber eher Interval vorschlagen)

 

[julesxxx]

AW: JQuery: animation wiederholen, während Element angeglickt wird

vielen dank
klappt super mit mousedown und mouseup