11540 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Je suis en train de faire une page HTML+CSS pour mobiles.
Cette page contiendra des infos sur un film.
Sur cette page, il y aura des photos. Lorsqu'on cliquera sur une des photos, le plugin Wonderwall sera utilisé (http://tympanus.net/Tutorials/WonderwallMobileGalleryStatic/#thumbs_container).
Ensuite, lorsqu'on clique sur une des photos de la galerie, on atterit sur la photo en question (comme dans l'exemple du lien ci-dessus).

Voici un bout de mon code de ma page Film:

<div id="photos">
  <h2>Les photos du film</h2>
  <div class="galerie">
    <a href="index.html"><img src="images/artist1.jpg" alt="Image 1" /></a>
    <a href="index.html"><img src="images/artist2.jpg" alt="Image 1" /></a>
    <a href="index.html"><img src="images/artist3.jpg" alt="Image 1" /></a>
  </div>
  <div class="galerie">
    <a href="index.html"><img src="images/artist4.jpg" alt="Image 1" /></a>
    <a href="index.html"><img src="images/artist5.jpg" alt="Image 1" /></a>
    <a href="index.html"><img src="images/artist6.jpg" alt="Image 1" /></a>
  </div>
</div>


Le fichier index.html correspond à la page http://tympanus.net/Tutorials/WonderwallMobileGalleryStatic/#thumbs_container et à la page http://tympanus.net/Tutorials/WonderwallMobileGalleryStatic/#photo_container. Voici un bout du code:

<div id="thumbs_container" class="current">
  <div class="loader" style="display:none;"></div>
  <ul id="thumbs" class="thumbView" style="display:none;">
    <li class="pic"><a href="#photo_container"><img src="thumbs/artist1.jpg" alt="images/artist1.jpg" title="The Artist 1"/></a></li>
    <li class="pic"><a href="#photo_container"><img src="thumbs/artist2.jpg" alt="images/artist2.jpg" title="The Artist 2"/></a></li>
    <li class="pic"><a href="#photo_container"><img src="thumbs/artist3.jpg" alt="images/artist3.jpg" title="The Artist 3"/></a></li>
    <li class="pic"><a href="#photo_container"><img src="thumbs/artist4.jpg" alt="images/artist4.jpg" title="The Artist 4"/></a></li>
    <li class="pic"><a href="#photo_container"><img src="thumbs/artist5.jpg" alt="images/artist5.jpg" title="The Artist 5"/></a></li>
    <li class="pic"><a href="#photo_container"><img src="thumbs/artist6.jpg" alt="images/artist6.jpg" title="The Artist 6"/></a></li>
  </ul>
</div>
<!-- The single image container -->
<div id="photo_container">
  <div class="loader" style="display:none;"></div>
  <div id="theimage" class="singleimage"></div>
  <div class="descriptionWrapper">
    <p id="description"></p>
    <div id="prev" style="display:none;"></div>
    <div id="next" style="display:none;"></div>
  </div>	
</div>

Actuellement lorsque je clique sur une de mes photos de ma fiche film, ça me fait une redirection direct vers index.html#thumbs_container.
J'aimerais qu'au lieu que ça me redirige vers cette URL, ça me redirige vers index.html#la_photo_en_question.
En gros, j'aimerais supprimer cette page http://tympanus.net/Tutorials/WonderwallMobileGalleryStatic/#thumbs_container, et que lorsque je clique sur <a href="index.html"><img src="images/artist2.jpg" alt="Image 1" /></a> par exemple, ça m'amène sur index.html#photo_container (de artist2.jpg).

Comment faire?
Modifié par Yuuko (27 Jun 2012 - 10:45)