wolfgang: jquery bildergallerie mit einen thumbs

hallo zusammen,
ich komme gerade irgendwie nicht weiter.
ich würde gerne eine bildergallerie bauen mit folgenden anforderungen:

  • großes bild
    -kleine thumbs die nicht automatisch erzeugt werden, sondern von mir von hand eingepflegt werden
  • einen prev, next button
  • die thumbs sollen übereinanderstehen. wenn es zu viele werden, soll ein pfeil nach unten auftauchen, wo bei klick die bilder nach oben weglaufen um platz für die neuen zu machen

ich habe derzeit versucht das ganze mit jquery tools umzusetzen.
folgende skripte hab ich versucht zu kombinieren:
http://flowplayer.org/tools/demos/tabs/index.html
http://flowplayer.org/tools/demos/tabs/wizard.html
http://flowplayer.org/tools/demos/scrollable/vertical.html

leider funktioniert es nicht, da beim vertikalen scrollen gleichzeigt die bildgallerei angesprochen wird und nurnoch die ersten 3 bilder angesprochen werden.
anbei der code:

$(document).ready(function() {  
  
$("ul.tabs").tabs("div.panes > div");  
var api = $("ul.tabs").data("tabs");  
  
$("a.next").click(function() {  
 api.next();  
});  
$("a.prev").click(function() {  
 api.prev();  
});  
$(".scrollable").scrollable({ vertical: true, mousewheel: true });  
});  

<a class="prev">prev</a>  
  
  
<!-- root element for scrollable -->  
<div class="scrollable vertical">  
  
   <!-- root element for the scrollable elements -->  
   <div class="items">  
  
      <!-- first element. contains three rows -->  
      <div>  
  
         <!-- first row -->  
         <ul class="tabs">  
         <li class="item"><a href="#" class="w2"><img src="images/index/test.gif" alt="..." /></a></li>  
         <li class="item"><a href="#" class="w2"><img src="images/index/test.gif" alt="..." /></a></li>  
         <li class="item"><a href="#" class="w2"><img src="images/index/test.gif" alt="..." /></a></li>  
         </ul>  
      </div>  
  
      <!-- second element with another three rows (and so on) -->  
      <div>  
  
         <!-- first row -->  
         <ul class="tabs">  
         <li class="item"><a href="#" class="w2"><img src="images/index/test.gif" alt="..." /></a></li>  
         <li class="item"><a href="#" class="w2"><img src="images/index/test.gif" alt="..." /></a></li>  
         <li class="item"><a href="#" class="w2"><img src="images/index/test.gif" alt="..." /></a></li>  
         </ul>  
      </div>  
  
   </div>  
  
</div>  
  
<a class="next">next</a>  
  
<!-- tab "panes" -->  
<div class="panes">  
	<div>1First tab content. Tab contents are called "panes"  
        <a href="#" class="prev">Prev</a>  
        <a href="#" class="next">Next</a>  
	  
        </div>  
	<div>2Second tab content  
        <a href="#" class="prev">Prev</a>  
        <a href="#" class="next">Next</a></div>  
	<div>3Third tab content  
        <a href="#" class="prev">Prev</a>  
        <a href="#" class="next">Next</a></div>  
        <div>4Third tab content  
        <a href="#" class="prev">Prev</a>  
        <a href="#" class="next">Next</a></div>  
        <div>5Third tab content  
        <a href="#" class="prev">Prev</a>  
        <a href="#" class="next">Next</a></div>  
        <div>6Third tab content  
        <a href="#" class="prev">Prev</a>  
        <a href="#" class="next">Next</a></div>  
</div>

so wie ich das sehe, gehe ich den absolut falschen weg.
kann mir jemand einen anderen aufweisen. allerdings muss ich sagen, dass meine js kenntnisse eher begrenzt sind und eher auf die anwenung beziehen.
ich danke euch für eure hilfe.
wolfgang

  1. Hi,

    leider funktioniert es nicht, da beim vertikalen scrollen gleichzeigt die bildgallerei angesprochen wird und nurnoch die ersten 3 bilder angesprochen werden.

    Und darunter sollen wir uns jetzt etwas vorstellen können?

    anbei der code:

    Anbei Zitat #1632

    allerdings muss ich sagen, dass meine js kenntnisse eher begrenzt sind und eher auf die anwenung beziehen.

    Dann wirst du entweder deine Kenntnisse erweitern, oder dich mit der Funktionalität, die Fertigscripte bieten, zufrieden geben müssen.

    MfG ChrisB

    --
    The most exciting phrase to hear in science, the one that heralds new discoveries, is not “Eureka!” but “That's funny...” [Isaac Asimov]
    1. Hallo,

      allerdings muss ich sagen, dass meine js kenntnisse eher begrenzt sind und eher auf die anwenung beziehen.
      Dann wirst du entweder deine Kenntnisse erweitern, oder dich mit der Funktionalität, die Fertigscripte bieten, zufrieden geben müssen.

      oder ein paar Euro in die Hand nehmen und jemanden beauftragen, der das in Ordnung bringt. Eventuell auch jemanden, der das als Freundschaftsdienst für lau macht.

      Ciao,
       Martin

      --
      Zwei Politiker auf dem Weg zum Sitzungssaal: "Was sagten Sie in ihrer Rede neulich noch zur Rentenreform?" - "Nichts." - "Ja, schon klar. Aber wie haben Sie es formuliert?"
      Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(