[resolu]Mauvais positionnement lightbox

bonjour a tous

j ai un petit soucis avec la lightbox
cette dernière s affiche trop bas sur l écran
comment corriger afin d avoir le même effet que sur cet exemple

http://lokeshdhakar.com/projects/lightbox2/

mon lien

http://la-peche-a-la-perle.forumgratuit.be/t22-essai123456#46

je joins mes fichiers html css compris

http://cjoint.com/?CEuxtTQR05W

et les fichiers javascript

http://cjoint.com/?CEuxuBhuzWz

http://cjoint.com/?CEuxu6s92ol

http://cjoint.com/?CEuxvyJ7ME4

http://cjoint.com/?CEuxv0HOTXw

un tout grand merci pour l iade et m aider a resoudre ce soucis
Modifié par flexi2202 (23 May 2013 - 19:44)

bonsoir a tous

petit up svp

Bonsoir,
Ton problème vient du fait que tu utilise une iframe. Pour corriger cela, essaie d'intégrer ta galerie de photos autrement qu'avec une iframe.

bonsoir
merci pour la reponse
mais comment faire autrement qu avec une iframe
j ai déjà fait des essais en mettant tout le code de l iframe dans un sujet de mon forum
Mais dans ce cas c est le foutoir les images sont les unes sous les autres et plus aucun effet n est possible

bonjour a tous

j ai refais mon message pour qu il soit plus clair

j ai un petit soucis avec le module de lightbox2

j essaye de faire un forum et de mettre des galerie d image dans un sujet
j ai donc télécharger lightbox2 et je l ai installer et il fonctionne parfaitement
une fois le code html crée avec les appels java et le css intégré je l ai mis dans une iframe
et j appelle l iframe dans un sujet de mon forum
tout fonctionne parfaitement bien , sauf que j ai la lightbox des images qui ne s affiche pas bien
les premiers images ca va ,mais au fur et a mesure que je descends dans les images de ma galerie la lightbox s

affiche toujours trop haut
voici un lien pour voir le phénomène
http://la-peche-a-la-perle.forumgratuit.be/t52-essai-avec-l-iframe#61

on me conseille de mettre ma galerie sans passer par une iframe j ai essayer
j ai donc pris tout le code html que j avais généré dans l iframe et je l ai copie dans un sujet de mon forum
et la une grosse cata car les images sont les unes sous les autres et plus aucun effet n apparait voir cet exemple

http://la-peche-a-la-perle.forumgratuit.be/t51-essai-light-box-direct-message

qui pourrait m aider un énorme merci

bonjour
un petit up svp j ai vraiment besoin d une piste

Tu as des erreurs javascripts dans ton forum. C'est pour cela que le script ne fonctionne pas sans iframe.

Corrige l'erreur du fichier 12928. D’ailleurs c'est quoi ce fichier ?

SyntaxError: missing } after property list
http://la-peche-a-la-perle.forumgratuit.be/12928.js
Line 1

merci pour la réponse
tout ces fichiers ont été trouve dans le module de lightbox que j ai télécharger depuis le site officiel
j ai de nouveau tout télécharger et remis dans la gestion des codes de javascript de forumgratuit

et comme il y avait aussi deux fichiers css je les ai héberger sur un serveur
je refais donc un essai en local nickel tout fonctionne a merveille

ah voila j ai donc remis le modèle modifie mais voici le résultat les deux pages se sont mélangées
ou alors les css embarque dans l iframe ont pris des effets sur ma page

http://la-peche-a-la-perle.forumgratuit.be/t51-essai-light-box-direct-message#60

le soucis vient bien du css

<link type="text/css" href="http://essai1.web44.net/lightbox/screen.css" rel="stylesheet">

sous firebug j ai supprimer l élément et tout est revenu dans l ordre mais je n ai plus l effet de lightbox sur les images

ah je me reprend je fais des essais , cela a l air de fonctionner je donne la solution si trouvee

merci de l aide
Modifié par flexi2202 (23 May 2013 - 15:44)

cela fonctionne
mais mon effet de tableau a disparu

peut être une piste pour en recreer un
car je vois qu il y a des div et ça pour moi c est ????
je donne le code pour une idée pour aménager un tableau
juste un début d idée
pour le tableau c est ok j utilise html
mais a présent j ai un espace entre le haut de ma page et mon tableau html avec firebug je vois que j ai <br>


un tout grand merci pour tout

<!doctype html>
<html lang="en-us">
<head>
	<meta charset="utf-8">
	<title>Lightbox 2</title>

	<meta name="description" lang="en" content="Lightbox 2 is a simple, unobtrusive script used to overlay images on the current page. It's a snap to setup and works on all modern browsers." />
  <meta name="author" content="Lokesh Dhakar">

  <meta name="viewport" content="width=device-width">

	<link rel="shortcut icon" type="image/ico" href="images/favicon.gif" />	
	
 <link rel="stylesheet" href="http://essai1.web44.net/lightbox/lightbox.css" type="text/css" />

<link rel="stylesheet"href="http://essai1.web44.net/lightbox/screen.css" type="text/css" />

  <link href='http://fonts.googleapis.com/css?family=Fredoka+One|Open+Sans:400,700' rel='stylesheet' type='text/css'>
</head>
<body>
<div id="content">
<div class="section" id="example">
	<center><h3>
<a href="http://la-peche-a-la-perle.forumgratuit.be/register"target="_parent">POUR LES ACQUÉRIR VOUS DEVEZ VOUS INSCRIRE ICI</a></h3></center>

  <div class="imageRow">
  	<div class="single">
<a href="http://p0.storage.canalblog.com/05/18/1093017/86843012_o.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>
  	<div class="single">
  	<a href="http://p0.storage.canalblog.com/05/18/1093017/86843012_o.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>

<div class="single">
  		<a href="http://p0.storage.canalblog.com/05/18/1093017/86843012_o.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>

  </div>


	<center><h3>
<a href="http://la-peche-a-la-perle.forumgratuit.be/register"target="_parent">POUR LES ACQUÉRIR VOUS DEVEZ VOUS INSCRIRE ICI</a></h3></center>

  <div class="imageRow">
  	<div class="single">
<a href="http://p0.storage.canalblog.com/05/18/1093017/86843012_o.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>
  	<div class="single">
  	<a href="http://p0.storage.canalblog.com/05/18/1093017/86843012_o.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>

<div class="single">
  		<a href="http://p0.storage.canalblog.com/05/18/1093017/86843012_o.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>

  </div>

<center><h3>
<a href="http://la-peche-a-la-perle.forumgratuit.be/register"target="_parent">POUR LES ACQUÉRIR VOUS DEVEZ VOUS INSCRIRE ICI</a></h3></center>

  <div class="imageRow">
  	<div class="single">
<a href="http://p0.storage.canalblog.com/05/18/1093017/86843012_o.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>
  	<div class="single">
  	<a href="http://p0.storage.canalblog.com/05/18/1093017/86843012_o.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>

<div class="single">
  		<a href="http://p0.storage.canalblog.com/05/18/1093017/86843012_o.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>

  </div>

	<center><h3>
<a href="http://la-peche-a-la-perle.forumgratuit.be/register"target="_parent">POUR LES ACQUÉRIR VOUS DEVEZ VOUS INSCRIRE ICI</a></h3></center>

  <div class="imageRow">
  	<div class="single">
<a href="http://p0.storage.canalblog.com/05/18/1093017/86843012_o.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>
  	<div class="single">
  	<a href="http://p0.storage.canalblog.com/05/18/1093017/86843012_o.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>

<div class="single">
  		<a href="http://p0.storage.canalblog.com/05/18/1093017/86843012_o.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>

  </div>


<center><h3>
<a href="http://la-peche-a-la-perle.forumgratuit.be/register"target="_parent">POUR LES ACQUÉRIR VOUS DEVEZ VOUS INSCRIRE ICI</a></h3></center>

  <div class="imageRow">
  	<div class="single">
<a href="http://p0.storage.canalblog.com/05/18/1093017/86843012_o.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>
  	<div class="single">
  	<a href="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>

<div class="single">
  		<a href="http://p0.storage.canalblog.com/05/18/1093017/86843012_o.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>

  </div>
<center><h3>
<a href="http://la-peche-a-la-perle.forumgratuit.be/register"target="_parent">POUR LES ACQUÉRIR VOUS DEVEZ VOUS INSCRIRE ICI</a></h3></center>

  <div class="imageRow">
  	<div class="single">
<a href="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>
  	<div class="single">
  	<a href="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>

<div class="single">
  		<a href="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>

  </div>
<center><h3>
<a href="http://la-peche-a-la-perle.forumgratuit.be/register"target="_parent">POUR LES ACQUÉRIR VOUS DEVEZ VOUS INSCRIRE ICI</a></h3></center>

  <div class="imageRow">
  	<div class="single">
<a href="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>
  	<div class="single">
  	<a href="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>

<div class="single">
  		<a href="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" rel="lightbox[plants]" title="Cliquer sur l image pour l'agrandir"><img src="http://i75.servimg.com/u/f75/16/55/74/32/photo_14.jpg" alt="Plants: image 1 0f 4 thumb" /><br /><b>REF A001</b></a>
  	</div>

  </div>


  	</div>
  </div>
	



</div><!-- end #content -->

/* jquery-1.7.2.min */
<script src="http://la-peche-a-la-perle.forumgratuit.be/23530.js"></script>
/* jquery-ui-1.8.18.custom.min. */
<script src="http://la-peche-a-la-perle.forumgratuit.be/25618.js"></script>
/* jquery.smooth-scroll.min */
<script src="http://la-peche-a-la-perle.forumgratuit.be/24570.js "></script>
/* lightbox2,51 */
<script src="http://la-peche-a-la-perle.forumgratuit.be/26534.js"></script>

<script>
  jQuery(document).ready(function($) {
      $('a').smoothScroll({
        speed: 1000,
        easing: 'easeInOutCubic'
      });

      $('.showOlderChanges').on('click', function(e){
        $('.changelog .old').slideDown('slow');
        $(this).fadeOut();
        e.preventDefault();
      })
  });

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-2196019-1']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>
</body>
</html>

Modifié par flexi2202 (23 May 2013 - 16:06)

voila c est regler tout fonctionne enfin

encore mille fois merci
alors j ai fait quoi ben c est simple comme chou tout compte fait

en premier lieu j ai télécharger la lightbox sur le site officiel un fichier zip
a l intérieur des fichier js et css

les fichiers js tous héberger sur forumgratuit
les fichiers css sur un hébergeur de fichier quelconque

j ai pris le code html de lightbox
j ai remplacer les liens des fichiers js et css par ceux que j ai obtenu

ensuite j ai tout pris et j ai copier dans un sujet de mon forum (un message quoi)
et la horreur le css de la page que je viens de mettre est venu interférer
j ai donc simplement supprimer lightbox/screen.css c est le fichier que j avais heberger
de la j ai refais un tableau remis les liens
et a présent je suis en train d enlever tout ce qui ne dérange pas au bon déroulement de la page