Liens dans ma page html se confond avec Jquery ?

Fermé
stephane2323 Messages postés 1 Date d'inscription mardi 25 août 2015 Statut Membre Dernière intervention 25 août 2015 - Modifié par NHenry le 25/08/2015 à 18:43
 newman - 26 août 2015 à 11:25
Bonjour j'ai besoin de votre aide svp....un casse-tête grrrrr

j'ai construit une galerie photo en Jquery et lorsque je test ma page tous les liens de celle-ci ne fonctionne plus...

Voici mon code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd]">
<html xmlns="[http://www.w3.org/1999/xhtml]">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Cuisine Bois-Briand</title>
<script  type="text/javascript" src="js/jquery.js"></script>
<script  type="text/javascript" src="js/jquery.lightbox-0.5.js"></script> 
<link  rel="stylesheet" href="css/jquery.lightbox-0.5.css" type="text/css" media="all" />
<script type="text/javascript">
$(function() {
    // Use this example, or...
    $('a[@rel*=lightbox]').lightBox(); // Select all links that contains lightbox in the attribute rel
    // This, or...
    $('#gallery a').lightBox(); // Select all links in object with gallery ID
    // This, or...
    $('a.lightbox').lightBox(); // Select all links with lightbox class
    // This, or...
    $('a').lightBox(); // Select all links in the page
    // ... The possibility are many. Use your creative or choose one in the examples above
});
</script>
<link rel="stylesheet" href="moderne.css" type="text/css" media="screen"/>
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
</script>
</head>

<body onload="MM_preloadImages('images/bouton/bouton1hover.png','images/bouton/boutonmateriauxhover.png')">
<div id="conteneur">
<div id="contenu">
<div id="contenuimage"><a href="images/moderne/1.jpg"><img src="images/moderne/small/1.jpg" alt="" width="144" height="116" border="0" /></a> <a href="images/moderne/2.jpg"><img src="images/moderne/small/2.jpg" width="144" height="116" border="0" /></a> <a href="images/moderne/3.jpg"><img src="images/moderne/small/3.jpg" width="144" height="116" border="0" /></a> <a href="images/moderne/4.jpg"><img src="images/moderne/small/4.jpg" width="144" height="116" border="0" /></a> <a href="images/moderne/5.jpg"><img src="images/moderne/small/5.jpg" width="144" height="116" border="0" /></a> <a href="images/moderne/6.jpg"><img src="images/moderne/small/6.jpg" width="144" height="116" border="0" /></a> <a href="images/moderne/7.jpg"><img src="images/moderne/small/7.jpg" width="144" height="116" border="0" /></a> <a href="images/moderne/8.jpg"><img src="images/moderne/small/8.jpg" width="144" height="116" border="0" /></a> <a href="images/moderne/9.jpg"><img src="images/moderne/small/9.jpg" width="144" height="116" border="0" /></a> <a href="images/moderne/10.jpg"><img src="images/moderne/small/10.jpg" width="144" height="116" border="0" /></a> <a href="images/moderne/11.jpg"><img src="images/moderne/small/11.jpg" width="144" height="116" border="0" /></a> <a href="images/moderne/12.jpg"><img src="images/moderne/small/12.jpg" width="144" height="116" border="0" /></a> <a href="images/moderne/13.jpg"><img src="images/moderne/small/13.jpg" width="144" height="116" border="0" /></a> <a href="images/moderne/14.jpg"><img src="images/moderne/small/14.jpg" width="144" height="116" border="0" /></a> <a href="images/moderne/15.jpg"><img src="images/moderne/small/15.jpg" width="144" height="116" border="0" /></a> <a href="images/moderne/16.jpg"><img src="images/moderne/small/16.jpg" width="144" height="116" border="0" /></a> <a href="images/moderne/17.jpg"><img src="images/moderne/small/17.jpg" width="144" height="116" border="0" /></a> <a href="images/moderne/18.jpg"><img src="images/moderne/small/18.jpg" width="144" height="116" border="0" /></a></div>
  <div id="texteameublement"><a href="surmesure.html"><img src="images/bouton/bouton1.png" name="mesure" width="250" height="58" border="0" id="mesure" onmouseover="MM_swapImage('mesure','','images/bouton/bouton1hover.png',1)" onmouseout="MM_swapImgRestore()" /></a><br />
  <a href="nosmateriaux.html"><img src="images/bouton/boutonmateriaux.png" name="materiaux" width="250" height="58" border="0" id="materiaux" onmouseover="MM_swapImage('materiaux','','images/bouton/boutonmateriauxhover.png',1)" onmouseout="MM_swapImgRestore()" /></a> </div>
<div id="commerciale1"> <span class="textslogan"><a href="contemporaine.html" class="lienhaut">- Cuisine
  contemporaine </a></span><br />
  <br />
  <br />
  <br />
  <span class="textslogan"><span class="lienhaut"><a href="vanite.html" class="lienhaut">- Vanité & salle de bain</a></span></span></div>
<div class="textslogan" id="droit">©2015 cuisinebois-briand.com - Tous droits réservés / Conception et réalisation : SB GRAPHIQUE</div>
<div id="adresse"><span class="Titre">POUR NOUS JOINDRE :</span><br />
  <br />
  <span class="adresse1">Ébénisterie Bois-Briand<br />1965 rue Charbonneau  Trois-Rivières, QC  G9A5C9<br />
  <br />Bureau : 819-840-6906<br />
Télécopieur : 819-840-5560<br />
Couriel :</span> <span class="adresse1"><a href="mailto:info@cuisinebois-briand.com">info@cuisinebois-briand.com</a><br />
<br />
NOS HEURES OUVERTURE :<br />Du lundi au jeudi de 7h30 à 5h<br />
Vendredi de 7h30 à 12h<br />
Rendez-vous de soir sur demande.

<br />
<br />
Venez discuter avec nous sur Facebook :)</span><br />
<br />
<span class="adresse1">Numéro RBQ : 5582-1870-01 </span></div>
<div id="mapgoogle"><iframe src="[https://www.google.com/maps/embed?pb=]!1m18!1m12!1m3!1d2755.4663025372956!2d-72.60132550000003!3d46.32043579999999!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x4cc7cf10ec7ef50d%3A0xf97e066b40a6f6!2s1965+Rue+Charbonneau%2C+Trois-Rivi%C3%A8res%2C+QC+G9A+5C9!5e0!3m2!1sfr!2sca!4v1439311518595" width="450" height="333" frameborder="0" style="border:0" allowfullscreen></iframe></div>
<div id="contenu1"><span class="textegenerale"><span class="Titre">Cuisine moderne adapté à vos besoins...</span><br />
  <br />
  <br />
  Une cuisine moderne ne doit <br />
  pas être confondue avec une <br />
  cuisine   contemporaine ou <br />
  design. Bien que les différences <br />
  soient minces et que   ces styles <br />
  soient proches, il existe des <br />
  nuances.<br />
  <br />
</span><span class="font4">La surface des meubles, des <br />
  portes, les poignées et boutons.<br />
  tout est personnalisable avec <br />
  une cuisine moderne.</span><br />
  <span class="textegenerale"><br />
  <a href="nosmateriaux.html">Voir nos matériaux </a></span><br />
  <br />
  <span class="textegenerale">Votre cuisine moderne et ses <br />
  composants sont parfaitement <br />
  adaptés à vos   besoins. <br />
  Pour prendre le moins de place possible, pour rester en   harmonie avec la décoration, pour se déplacer facilement... Tout est   possible. </span></div>
<div id="slogan"><span class="textelogo">Ébénisterie Bois-Briand | 819-840-6906</span><br />
  <span class="textslogan">Réalisation, fabrication et installation de cuisine, de salle de bain et de meuble sur mesure.</span></div>
<div id="logofacebook"><a href="[https://www.facebook.com/pages/%C3%89benisterie-Bois-Briand/221796081310722?fref=ts]" target="_blank"><img src="images/face.jpg" width="135" height="49" border="0" /></a></div>
<div id="menu">
  <ul id="MenuBar1" class="MenuBarHorizontal">
    <li><a href="index.html">Accueil</a>      </li>
    <li><a href="#" class="MenuBarItemSubmenu">Résidentiel</a>
      <ul>
        <li><a href="#">Cuisine</a></li>
        <li><a href="#">Vanité & salle de bain</a></li>
      </ul>
    </li>
    <li><a href="#" class="MenuBarItemSubmenu">Commerciale</a>
      <ul>
        <li><a href="#">Cuisine</a></li>
        <li><a href="#">Vanité & salle de bain</a></li>
      </ul>
    </li>
    <li><a href="#">Contemporain</a></li>
    <li><a href="moderne.html">Moderne</a></li>
    <li><a href="#">Classique</a></li>
    <li><a href="contact.html">Contact</a></li>
  </ul>
</div></div>
</div>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
</script>
</body>
</html>


EDIT : Ajout du LANGAGE dans les balises de code (la coloration syntaxique).
Explications disponibles ici : ICI

Merci d'y penser dans tes prochains messages.
A voir également:

1 réponse

Salut,
votre façon d'utiliser JQuery paraît fausse à moins que vous ayez renommé le fichier source(bibliothéque ou framework) Jquery en jquery.js il est tout simplement manquant et ne pourra donc s'appliquer.
Toujours dans le même autre d'idée il manque le $(document).ready() à l'initiative de tout code JQuery. A moins que je me trompe et que vous ayez modifié vous mêmes ces sources(ce qui n'est pas vraiment reccomandé dans un soucis de clarté et réutilisation du code)

Je ne vous recommande pas non plus de mélanger les scripts de dreamweaver avec votre propre javascript et une lightbox, c'est compliqué pour rien (le fait de dreamweaver) votre code et le rendre beaucoup moins accessible.

Pour modifier un lien avec JQuery vous devez utiliser votre sélecteur JQuery et la fonction css comme ceci:

$('a#id').css('href', url du lien);
id étant à remplacé par l'id concernnée du lien ou tout autre façon d'accéder à votre lien (comme avec xpath qui ne nécessite pas jquery).
0