Problème du code de mon site avec une lightbox jquery

Résolu/Fermé

Justinedupre Messages postés 34 Date d'inscription mercredi 11 mai 2016 Statut Membre Dernière intervention 1 juin 2016 - Modifié par jordane45 le 27/05/2016 à 15:50
jordane45 Messages postés 38311 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 24 novembre 2024 - 1 juin 2016 à 11:09

Bonjour,

J'ai un soucie dans le code de mon site,

j'ai installé une lightbox mais deux problèmes se posent,
elle ne marche que s'il y a un '.' en plein milieu du code (je l'ai mis en gras, ligne 7) et elle décalle également ma nav vers le bas ...

SI quelqu'un trouvait le problème ce serait super ! merci

<!DOCTYPE html>
<html lang="fr">
 <head>

  <title>Portfolio Justine - Work</title>
  
  <meta charset="UTF-8"/><bold>.
</bold>
  <link rel="stylesheet" href="css/reset.css"/>
  <link rel="stylesheet" href="css/main.css"/>
  <link href="dist/css/lightbox.min.css" rel="stylesheet">
<script src="js/jquery-2.2.1.min.js"></script>
<script src="dist/js/lightbox.min.js"></script>

 </head>




 <body class="center" id="fond2">
 <header class="clearfix">
 <nav class="clearfix">
   <ul id="ul1">
   <li><a href="index.html" id="home" >Home</a></li>
   <li><a href="work.html" id="work" class="active">Work</a>
    <ul id="menud">
     <li><a href="work.html">PAO</a></li>
     <li><a href="workvideo.html">VIDEO</a></li>
     <li><a href="workphoto.html" >PHOTO</a></li>
     <li><a href="workdessin.html">DESSIN</a></li>
   </li>
    </ul>
   <li><a href="contact.html" id="contact">Contact</a></li>
  </ul>

 <h1 id="ul2"><a href="index.html">
  <img src="img/logomini.png" alt="Logo"/>
 </a></h1>

 </nav>
</header>

 <article class="center">

  <h1 id="titrepage2">WORK</h1>
  <ul id="titre2">
   <li><a href="work.html" class="active1"id="st1">PAO</a></li>
   <li><a href="workvideo.html" id="st2">VIDEO</a></li>
   <li><a href="workphoto.html"  id="st3">PHOTO</a></li>
   <li><a href="workdessin.html" id="st4">DESSIN</a></li>


  </ul>
</article>

  <article class="center">

  <div class="clearfix zoom1" id="figuremini">

  
  <figure class="over">
  <a href="img/soda.png" data-lightbox="marc" title="Capsule de boissons">
    <img src="img/sodamini.jpg" alt="neon" id="neon"/>
  <figcaption>
  <h1>Illustrator </h1>
  <p>Capsules de boissons</p>
  </figcaption></a>
  </figure>


  <figure class="over" >
    <a href="img/princess.png" data-lightbox="marc" title="Affiche - Keep calm"><img src="img/princessmini2.jpg" alt="princess"/>
  <figcaption>
  <h1>Affiche - Photoshop</h1>
  <p> Affiche Keep Calm</p>
  </figcaption>
  </a>   
  </figure>


   <figure class="over">
    <a href="img/oasis.jpg" data-lightbox="marc" title="Affiche pub - Bouteille Oasis"><img src="img/oasismini2.jpg" alt="oasis" id="oasis" />
  <figcaption>
  <h1>Affiche - Illustrator</h1>
  <p>Publicité Oasis</p>
  </figcaption>
  </a>   
 </figure>


 <figure class="over">
    <a href="img/classique.png" data-lightbox="marc" title="Affiche - Danse classique"><img src="img/classiquemini2.jpg" alt="danse classique" id="danse"/>
  <figcaption>
  <h1>Affiche - Photoshop</h1>
  <p>Affiche danse classique</p>
  </figcaption> 
  </a>  
 </figure>


 <figure class="over">
   <a href="img/demakup.png" data-lightbox="marc" title="Affiche pub - Demak'up">
    <img src="img/visagemini2.jpg" alt="demakup" id="demakup"/>
  <figcaption>
  <h1>Affiche - Photoshop</h1>
  <p>Publicité Demak'up</p>
  </figcaption>
  </a>   
 </figure>



 <figure class="over">
   <a href="img/lessismore.png" data-lightbox="marc" title="Affiche - Exposition "Less is more"">
    <img src="img/lessismoremini2.jpg" alt="lessismores" id="less"/>
  <figcaption>
  <h1>Affiche - Photoshop</h1>
  <p>Exposition Mies Van der Rohe</p>
  </figcaption>
  </a>
 </figure>


 <figure class="over">
   <a href="img/macdo.jpg" data-lightbox="marc" title="Affiche pub - Macdonald">
    <img src="img/macdomini2.jpg" alt="macdo" id="macdo"/>
  <figcaption>
  <h1>Affiche - Photoshop</h1>
  <p>Publicité Mcdonald</p>
  </figcaption> 
  </a>   
 </figure>


 <figure class="over">
   <a href="img/drive.png" data-lightbox="marc" title="Affiche film - Drive">
    <img src="img/drivemini2.jpg" alt="drive" id="drive"/>
  <figcaption>
  <h1>Affiche - Photoshop</h1>
  <p>Affiche du film Drive</p>
  </figcaption>
  </a>
 </figure>


 
 <figure class="over">
  <a href="img/drivecitation.jpg" data-lightbox="marc" title="Affiche citation - Drive">
    <img src="img/drivecitationmini2.jpg" alt="drivecitation" id="drivecitation"/>
  <figcaption>
  <h1>Affiche - Photoshop</h1>
  <p>Citation du film Drive</p>
  </figcaption> 
  </a>   
 </figure> 

 <figure class="over">
  <a href="img/miracle.png" data-lightbox="marc" title="Affiche film - Miracle">
    <img src="img/miraclemini2.jpg" alt="miracle" id="miracle"/>
  <figcaption>
  <h1>Affiche - Illustrator</h1>
  <p>Affiche du film Miracle</p>
  </figcaption>
  </a>
 </figure>


 <figure class="over">
  <a href="img/vin.jpg" data-lightbox="marc" title="Affiche citation - Musique">
    <img src="img/vinmini2.jpg" alt="miracle" id="Jul"/>
  <figcaption>
  <h1>Affiche - Photoshop</h1>
  <p>Citation de chanson </p>
  </figcaption>
  </a>
 </figure>

 <figure class="over">
  <a href="img/leprenom.jpg" data-lightbox="marc" title="Affiche film - Le Prénom">
    <img src="img/leprenommini2.jpg" alt="prenom" id="prenom"/>
  <figcaption>
  <h1>Affiche - Illustrator</h1>
  <p>Affiche du film Le Prénom </p>
  </figcaption>
  </a>
 </figure>
  
  
 <figure class="over">
  <a href="img/airforce.jpg" data-lightbox="marc" title="Affiche pub - Nike">
    <img src="img/nikemini2.jpg" alt="airforce" id="airforce"/>
  <figcaption>
  <h1>Affiche - Photoshop</h1>
  <p>Publicité pour NIKEiD</p>
  </figcaption></a>    
 </figure>



<figure class="over">
  <a href="img/pingouin.png" data-lightbox="marc" title="Pingouin">
    <img src="img/pingouinmini.jpg" alt="pingouin" id="pingouin"/>
  <figcaption>
  <h1>Illustrator </h1>
  <p>Pingouin</p>
  </figcaption></a> 

 </figure>
 <figure class="over">
  <a href="img/cartedevisite.jpg" data-lightbox="marc" title="Carte de visite">
    <img src="img/cartedevisitemini2.jpg" alt="carte" id="carte"/>
  <figcaption>
  <h1>Illustrator/Photoshop </h1>
  <p>Carte de visite Chauffeur privé</p>
  </figcaption></a>    
 </figure>

<figure class="over">
  <a href="img/neon.jpg" data-lightbox="marc" title="Néon Close">
    <img src="img/neonmini.jpg" alt="neon" id="neon"/>
  <figcaption>
  <h1>Illustrator </h1>
  <p>Néon "Close"</p>
  </figcaption></a>    
 </figure>


<figure class="over">
  <a href="img/pingouinmockup.png" data-lightbox="marc" title="T-shirt pingouin">
    <img src="img/pingouinmockupmini.png" alt="pingouin" id="pingouin"/>
  <figcaption>
  <h1>Illustrator/Photoshop </h1>
  <p>T-shirt pingouin</p>
  </figcaption></a>    
 </figure>

 <figure class="over">
  <a href="img/robot.jpg" data-lightbox="marc" title="Robot">
    <img src="img/robotmini.jpg" alt="neon" id="robot"/>
  <figcaption>
  <h1>Illustrator</h1>
  <p>Robot</p>
  </figcaption></a>    
 </figure>

  </div> 




 </article>
 <footer>
  <p>
   Justine Claverie © - 2016
  </p>
 </footer>
 <script src="path/to/lightbox.js"></script>

 </body>

</html>

EDIT : Ajout des balises de code (la coloration syntaxique).
Explications disponibles ici :ICI

Merci d'y penser dans tes prochains messages.

A voir également:

Problème du code de mon site avec une lightbox jquery
Site de telechargement - Accueil - Outils
Voici du code ascii : - Guide
Site comme coco - Accueil - Réseaux sociaux
Site de vente en ligne particulier - Guide
Site inaccessible - Guide

1 réponse

Réponse 1 / 1

jordane45 Messages postés 38311 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 24 novembre 2024 4 705
27 mai 2016 à 15:52

Bonjour,

Commence par lire ceci : https://www.alsacreations.com/astuce/lire/69-declarer-encodage-des-caracteres.html

Ensuite, une fois les corrections apportées, que t'affiche la CONSOLE de ton navigateur lorsque tu essayes de faire fonctionner ton script ?
(De préférence... utilise le plugin FIREBUG pour FIREFOX )

Justinedupre Messages postés 34 Date d'inscription mercredi 11 mai 2016 Statut Membre Dernière intervention 1 juin 2016 5
1 juin 2016 à 10:56

Merci de ton aide,
finalement je l'avais supprimé et remise et tout est résolu :)

Merci quand même

jordane45 Messages postés 38311 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 24 novembre 2024 4 705 > Justinedupre Messages postés 34 Date d'inscription mercredi 11 mai 2016 Statut Membre Dernière intervention 1 juin 2016
1 juin 2016 à 11:09

Si la question est résolue..
Merci de ne pas oublier de clôturer le sujet
(en cliquant sur le lien "Marquer comme résolu" qui se trouve sous le titre de la question)

Cordialement,
Jordane

Discussions similaires

[SUJET GROUPÉ] Le site COCO.GG est définitivement fermé.

C'est quoi le site qui remplace coco chat

Colis en cours de transport vers votre site de livraison ?