4 réponses
varfendell
Messages postés
3256
Date d'inscription
jeudi 27 décembre 2007
Statut
Membre
Dernière intervention
8 février 2020
699
27 juil. 2010 à 13:23
27 juil. 2010 à 13:23
Tu peut nous mettre le code de ta page avec ta "colorBox" entre les balise code pour que ça soit lisible s'il te plait
<!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>Be @ The Right Place</title> <link rel="stylesheet" href="css/main.css" type="text/css"/> <link media="screen" rel="stylesheet" href="css/colorbox.css"/> <link rel="stylesheet" href="css/content_colorbox.css" type="text/css"/> <link rel="icon" type="image/x-icon" href="images/favicon.ico"> <link rel="shortcut icon" type="image/x-icon" href="images/favicon.ico"> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript" src="js/interface.js"></script> <script type="text/javascript" src="js/jquery.colorbox.js"></script> <script type="text/javascript" src="js/jquery.colorbox-min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $(".colorbox").colorbox(); $("#click").click(function(){ $('#click').css({"background-color":"#f00", "color":"#fff", "cursor":"inherit"}).text("Open this window again and this message will still be here."); return false; }); }); </script> </head> <body> <div id="container"> <div id="menuLeft"> <ul> <li><a id="journalisme" class='colorbox' href="content/journalisme.html" ><img src="images/menuLeftJournalismeHover.png" alt="journalisme" title="journalisme"/></a></li> <li><a id="communication" class='colorbox' href="content/communication.html"><img src="images/menuLeftCommunicationHover.png" alt="communication" title="communication"/></a></li> <li><a id="creations" class='colorbox' href="content/creations.html"><img src="images/menuLeftCreationsHover.png" alt="creations" title="creations"/></a></li> </ul> </div> <div id="menuRight"> <ul> <li><a id="horlogerie" class='colorbox' href="content/horlogerie.html"><img src="images/menuRightHorlogerieHover.png" alt="horlogerie" title="horlogerie"/></a></li> <li><a id="afrique" class='colorbox' href="content/afrique.html"><img src="images/menuRightAfriqueHover.png" alt="afrique" title="afrique"/></a></li> <li><a id="voyage" class='colorbox' href="content/voyage.html"><img src="images/menuRightVoyageHover.png" alt="voyage" title="voyage tourisme"/></a></li> <li><a id="sante" class='colorbox' href="content/sante.html"><img src="images/menuRightSanteHover.png" alt="sante" title="sante bien etre"/></a></li> <li><a id="redaction" class='colorbox' href="content/redaction.html"><img src="images/menuRightRedactionHover.png" alt="redaction" title="redaction"/></a></li> <li><a id="musique" class='colorbox' href="content/musique.html"><img src="images/menuRightMusiqueHover.png" alt="musique" title="musique"/></a></li> <li><a id="custom" class='colorbox' href="content/custom.html"><img src="images/menuRightCustomHover.png" alt="custom publishing" title="custom publishing"/></a></li> <li><a id="editions" class='colorbox' href="content/editions.html"><img src="images/menuRightEditionsHover.png" alt="editions musicales" title="editions musicales"/></a></li> <li><a id="product" class='colorbox' href="content/product.html"><img src="images/menuRightProductHover.png" alt="product" title="product"/></a></li> <li><a id="evenementiel" class='colorbox' href="content/evenementiel.html"><img src="images/menuRightEvenementielHover.png" alt="evenementiel" title="journalisme"/></a></li> <li><a id="reseautage" class='colorbox' href="content/reseautage.html"><img src="images/menuRightReseautageHover.png" alt="reseautage" title="reseautage"/></a></li> <li><a id="relations" class='colorbox' href="content/relations.html"><img src="images/menuRightRelationsHover.png" alt="relations publiques" title="relations publiques"/></a></li> <li><a id="bureau" class='colorbox' href="content/bureau.html"><img src="images/menuRightBureauHover.png" alt="bureau" title="bureau d'ecriture"/></a></li> <li><a id="scenarios" class='colorbox' href="content/scenarios.html"><img src="images/menuRightScenariosHover.png" alt="scenarios" title="scenarios"/></a></li> <li><a id="prowatch" class='colorbox' href="content/prowatch.html"><img src="images/menuRightProwatchHover.png" alt="association ProWatCH" title="association ProWatCH"/></a></li> <li><a id="projo" class='colorbox' href="content/projo.html"><img src="images/menuRightProjoHover.png" alt="association ProJo-Org" title="association ProJo-Org"/></a></li> </ul> </div> <div id="dock"> <div class="dock-container"> <a class="dock-item" href="http://www.therightplace.ch/therightplace/" target="_blank"><img src="images/logos/therightplace.png" alt="the right place" /><span>Afters Work</span></a> <a class="dock-item" href="http://www.tagpress41.info/" target="_blank"><img src="images/logos/tag.png" alt="TaG press" /><span>Press Agency</span></a> <a class="dock-item" href="http://therightplace.canalblog.com/" target="_blank"><img src="images/logos/trp.png" alt="@TRP" /><span>Dpt RP</span></a> <a class="dock-item" href="http://www.bloghorloger.ch/" target="_blank"><img src="images/logos/bloghorloger.png" alt="blog horloger" /><span>Horlogerie Suisse</span></a> <a class="dock-item" href="http://jshandmore.canalblog.com/" target="_blank"><img src="images/logos/jsh.png" alt="journal suisse horlogerie" /><span>JSH'Blog</span></a> <a class="dock-item" href="http://www.lionsprod.com/" target="_blank"><img src="images/logos/lions.png" alt="lions production" /><span>Musique & Ciné</span></a> <a class="dock-item" href="http://forleaders.afrikblog.com/" target="_blank"><img src="images/logos/forleaders.png" alt="for leaders" /><span>Africa Business Mag</span></a> <a class="dock-item" href="#" target="_blank"><img src="images/logos/vmandco.png" alt="VM and Co" /><span>VM & Co Watches</span></a> <a class="dock-item" href="#" target="_blank"><img src="images/logos/grandjean.png" alt="grandjean" /><span>Grandjean Watches</span></a> <a class="dock-item" href="#" target="_blank"><img src="images/logos/horlogefleurie.png" alt="horloge fleurie" /><span>Horloge Fleurie GE</span></a> <a class="dock-item" href="#" target="_blank"><img src="images/logos/prowatch.png" alt="prowatch" /><span>Culture horlogère</span></a> <a class="dock-item" href="#" target="_blank"><img src="images/logos/projo.png" alt="projo.org" /><span>Editions, Productions</span></a> <a class="dock-item" href="http://nashandmore.afrikblog.com/" target="_blank"><img src="images/logos/nash.png" alt="nash" /><span>Nash'Official Blog</span></a> <a class="dock-item" href="http://dardaif.canalblog.com/" target="_blank"><img src="images/logos/dardaif.png" alt="dar daif" /><span>Dar Daif</span></a> <a class="dock-item" href="http://bedingeneva.canalblog.com/" target="_blank"><img src="images/logos/bedingeneva.png" alt="bed in geneva" /><span>Bed in Geneva</span></a> </div> </div> </div> <div id="banniere"> <a id="lienBanniereGauche" href="https://pilo-watches.com/" target="_blank"><img src="images/bannieres/banniere_pilo_468x60.png" alt="pilo and co"/></a> <a id="lienBanniereDroite" href="http://www.duovisual.ch/visual2/" target="_blank"><img src="images/bannieres/banniere_duo_visual_468x60.png" alt="duo visual"/></a> </div> <!--dock menu JS options --> <script type="text/javascript"> $(document).ready( function() { $('#dock').Fisheye( { maxWidth: 30, items: 'a', itemsText: 'span', container: '.dock-container', itemWidth: 40, proximity: 90, halign : 'center' } ) } ); </script> <!--[if lt IE 7]> <style type="text/css"> .dock img { behavior: url(iepngfix.htc) } </style> <![endif]--> </body> </html>
Voilà tout le code de ma page. Sur chaque lien ou je souhaite voir apparaitre la colorbox, j'appelle la classe "colorbox".