[HTML/CSS/Javascript] Nombreuses Images avec mignature

Nombreuses Images avec mignature [HTML/CSS/Javascript] - HTML/CSS - Programmation

Marsh Posté le 11-06-2013 à 10:32:52    

Bonjour à tous,
 
Je souhaiterais heberger mes images. J'ai 10 dossiers contenant environ 30 photos chacun.
Je souhaite faite une page avec 10 lien qui pointe vers les 10 dossiers. avec si possible dans chaque dossier des miniatures.
Je veux bien créer les miniatures et les renomés.
 
1miniatures.jpg  
1.jpg  
 
La page du dossier affiche toute les miniature et chaque miniature contient un lien vers l'image entière.
 
Quel serai le code et comment le répéter.
Merci pour votre aide
 
 

Reply

Marsh Posté le 11-06-2013 à 10:32:52   

Reply

Marsh Posté le 11-06-2013 à 11:22:10    

Reply

Marsh Posté le 11-06-2013 à 14:44:06    

Merci Mechkurt


Message édité par iixii le 11-06-2013 à 17:33:28
Reply

Marsh Posté le 11-06-2013 à 15:20:15    

J'essaye avec wampserver pour l'hebergement local, ça marche bien.
 
J'ai trouvé un code super simple.
 
J'essaye de mettre un slideshow sur la première page maintenant.
 
Merci encore !!


Message édité par iixii le 11-06-2013 à 17:34:25
Reply

Marsh Posté le 14-06-2013 à 09:31:29    

Bonjour,
 
Encore un petit soucis. Mon site marche bien en local avec wampserver mais lorsque je le met sur le net ça ne marche pas. Les images du slides show ne s'affiche pas.
 
www.911sc.fr
 
<!doctype html>
<html lang="en">
 <head>
  <meta charset="utf-8" />
  <title>911 SC 1982</title>
  <link rel="stylesheet" href="css/style.css" />
 </head>
  <body>
  <center><h1>1982 SC 3.0 USA NOIR</h1></center>
  <div class="main">
    <div class="rss-container">
    <div id="slideshow" class="rs-slideshow">
     <div class="slide-container">
      <center><img src="./images/slideshow/moismall.jpg" alt="The first image in a slideshow demo." title="La mienne à son arrivée en France" />
        data-link-to="./images/slideshow/moi.jpg">La mienne à son arrivée en France</a></center>
      <span class="slide-caption">La mienne à son arrivée en France</span>
     </div>
     <ol class="slides">
      <li>
       <a href="./images/slideshow/moismall.jpg"  
        title="La mienne à son arrivée"
        data-link-to="./images/slideshow/moi.jpg">La mienne à son arrivée</a>
      </li>
      <li>
       <a href="./images/slideshow/1small.jpg"  
        title="Mon objectif: une SC de 82 neuve !"
        data-link-to="./images/slideshow/1.jpg">Mon objectif: une SC de 82 neuve !</a>
      </li>
      <li>
       <a href="./images/slideshow/2small.jpg"  
        title="Même année !"
        data-link-to="./images/slideshow/2.jpg">Même année !</a>
      </li>
      <li>
       <a href="./images/slideshow/3small.jpg"  
        title="Même couleur !"
        data-link-to="./images/slideshow/3.jpg">Même couleur !</a>
      </li>
      <li>
       <a href="./images/slideshow/4small.jpg"  
        title="Mêmes options !"  
        data-link-to="./images/slideshow/4.jpg">Mêmes options !</a>
      </li>
      <li>
       <a href="./images/slideshow/5small.jpg"  
        title="Voiture vendue chez Truspeed au US !"
        data-link-to="./images/slideshow/5.jpg">Voiture vendue chez Truspeed au US !</a>
      </li>
     </ol>
    </div>
     
 
    <!--<ul class="controls clearfix">
     <li><a href="#" class="rs-play-pause" data-control-for="slideshow">Click to Pause</a></li>
     <li><a href="#" class="rs-prev" data-control-for="slideshow">Previous Slide</a></li>
     <li><a href="#" class="rs-next" data-control-for="slideshow">Next Slide</a></li>
    </ul>-->
 
   
   
   </div>
   
   
   
   
   
  </div>
   
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  <script src="js/jquery.rs.slideshow.js"></script>
  <script src="js/dynamic-controls-bootstrap.js"></script>
   </body>
-- > <a href="./images/Renovation/">Renovation</a> Zoom sur les parties entièrement rénovées <BR>
-- > <a href="./images/Ensemble/">Vue d'ensemble</a> <BR>
-- > <a href="./images/Carrosserie/">Carrosserie</a> <BR>
-- > <a href="./images/DirectionSusAvant/">Direction Suspension Avant</a> <BR>
-- > <a href="./images/Electricite/">Electricite</a> <BR>
-- > <a href="./images/EssenceEchappement/">Essence Echappement</a> <BR>
-- > <a href="./images/FreinsRoues/">Freins Roues</a> <BR>
-- > <a href="./images/Moteur/">Moteur</a> <BR>
-- > <a href="./images/PedaleLevier/">Pedale Leviers</a> <BR>
-- > <a href="./images/SusArriere/">Suspension Arriere</a> <BR>
-- > <a href="./images/Transmission/">Transmission</a> <BR>
-- > <a href="./images/Divers/">Divers</a> <BR>
-- > <a href="./images/Truspeed/">911 SC 1982 neuve - Truspeed - belle exemple de voiture en parfait état</a> <BR>
 
</html>

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed