2010-11-26 6 views
1

Ich habe hoch und niedrig gesucht, aber sehr wenig gefunden, um mein gewünschtes Ergebnis zu erzielen, ich versuche, eine Reihe von Bildern zu nehmen, und erstellen Sie eine glatte automatische Bildlauf horizontal Scroller, ähnlich zu diesem http://www.enova-tech.net/eng/lab/jmycarousel/1, das Problem, das ich habe, ist, dass dieses Plug-in auf jQuery 1.3.2 gebaut wurde, wenn ich mich nicht irre, so würde ich gerne meine eigene, aber mit der jQuery 1.4.2, so jetzt auf die Frage.Erstellen eines automatischen Scrolling zirkuläre jquery Bildscroller

Alle anderen Plug-Ins, die Sie kennen, können den gleichen automatischen Scroll-Effekt erzielen? Wenn nicht, wie sollte ich einen solchen Scroller erstellen?

Das einzige, was mich verrückt macht, ist, wie ich den Scroller zum automatischen Scrollen kontinuierlich bekommen kann, irgendwelche Ideen?

Der HTML-Markup würde wie folgt aussehen:

HTML:

<div id="container"> 
    <div><img src="/image1.jpg" /></div> 
    <div><img src="/image2.jpg" /></div> 
    <div><img src="/image3.jpg" /></div> 
    <div><img src="/image4.jpg" /></div> 
    <div><img src="/image5.jpg" /></div> 
    <div><img src="/image6.jpg" /></div> 
    <div><img src="/image7.jpg" /></div> 
    <div><img src="/image8.jpg" /></div> 
</div> 

Danke im Voraus!

+0

, wenn ich google nach "jquery Karussell-Plugin" (http://www.google.de/#sclient=psy&hl=de&q=jquery+carousel+plugin&aq=2&aqi=g4g-o1&aql= fragen & oq = & gs_rfai = & pbx = 1 & fp = 68cd5877826b624c) ich bekomme viele gut aussehende dinge, die mit der neuesten jquery kompatibel sind ... – oezi

Antwort

0

Eine Bibliothek, mit der ich zufrieden bin, ist die jQuery innerfade.
Die javascript:

$('#image_rotate').innerfade({ 
    speed: 'slow', 
    timeout:3000 , 
    type: 'sequence', 
    containerheight: '248px' 
}); 

Und der HTML:

<ul class="innerfade" id="image_rotate" style="list-style: none outside none;"> 
    <li><img src="/getattachment/1c0b7e7c-5a17-48f3-ba21-f3ff59a70423/.jpg" /></li> 
    <li><img src="/getattachment/8d5556dd-6331-48aa-b419-d64f1de9745e/.jpg" /></li> 
    <li><img src="/getattachment/65a0474f-9afa-414f-85f1-7cda5ccfffee/.jpg" /></li> 
    <li><img src="/getattachment/65f553eb-a07a-4c30-93ab-f9bbf6784139/.jpg" /></li> 
    <li><img src="/getattachment/84ec5f3d-c5a3-40e1-a680-7d27de35ec95/.jpg" /></li> 
    <li><img src="/getattachment/4a393530-5bdb-4417-be20-0e55981db159/.jpg" /></li>  
</ul> 

EDIT: Erfordert, dass Sie die jQuery libary umfassen zuerst, dann die innefadelibary. Schauen Sie auf den Link in der Post

Verwandte Themen