Felix Riesterer: Fancy Image anzeigen

Beitrag lesen

Liebe Birgit,

ich weiß ja nicht, was "tump" ist, aber mit tumb kenne ich mich aus.

Dein Anliegen lässt sich mit reinen HTML/XHTML-Mitteln nicht lösen. Daher habe ich den Themenbereich auf "Javascript" gestellt.

Wie kann ich das am einfachsten realisieren mit jQuery? Habt ihr da eine Idee?

Du könntest mit jQuery sicherlich Teile Deiner Seite zusammenfalten, um sie auf einen Klick oder eine Auswahlbox hin entsprechend wieder auseinander zu falten. Damit kannst Du dann Deine Reisen voneinander trennen.

Als Dokumentstruktur bräuchtest Du in etwa sowas:

  
<p>Bilder zu folgender Reise anzeigen: <select id="auswahl">  
    <option value="amerika-reise">Amerika-Reise</option>  
    <option value="kanada-reise">Kanada-Reise</option>  
    <option value="...-reise">...-Reise</option>  
</select></p>  
<div id="amerika-reise">  
    <h2>Amerika-Reise</h2>  
    <p>Bilder lassen sich durch Anklicken vergrößern.</p>  
    <ul>  
        <li> ... <a href ...</li>  
        <li> ... </li>  
        ...  
    </ul>  
</div>  
<div id="kanada-reise">  
    <h2>Kanada-Reise</h2>  
    <p>Bilder lassen sich durch Anklicken vergrößern.</p>  
    <ul>  
        <li> ... <a href ...</li>  
        <li> ... </li>  
        ...  
    </ul>  
</div>  
<div id="...-reise">  
</div>

Ich habe die Fancybox nie benutzt, deshalb weiß ich nicht, ob die in den jeweiligen Listen abgelegten Thumbnails dann auch als abgegrenzte Galerie "durchklickbar" sind, oder ob im obigen Beispiel der letzte Link der Amerika-Reise nicht als Nachfolgebild das erste von der Kanada-Reise ansteuert.

Da ich mit jQuery noch nie gearbeitet habe, kann ich Dir auch nicht aus dem Hut zaubern, wie Du das Umschalten und Verstecken der Bereiche machen kannst.

Liebe Grüße,

Felix Riesterer.

--
ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:)