effet lightbox (mutlibox ou squeezebox)

Marsh Posté le 12-09-2009 à 10:24:55

Bonjour,

Je souhaiterais avoir votre aide car je ne parviens pas à intégrer la squeezebox ou la multibox. L'effet recherché serait d'afficher un texte au chargement de la page. Je travaille sur typolight qui intègre la librairie mootools par défaut. Voici ce que j'ai fait :

- J'ai ensuite télécharger les fichiers js et css et je les ai appelé dans le header (j'ai fait une vérification en mettant une fonction perso dedans ils sont bien reconnus).
- J'ai mis les quelques lignes de script dans la page, ce qui pour la multibox ressemble à ceci :

Code :

<script type="text/javascript">
var box = {};
window.addEvent('domready', function(){
box = new MultiBox('mb', {descClassName: 'multiBoxDesc', useOverlay: true});
});
</script>

- J'ai ajouté sur la page le code html exemple suivant (fournis sur la page : http://www.phatfusion.net/multibox/) :

Code :

<div id="example">
<a href="tl_files/javascript/IMG_8966.jpg" id="mb1" class="mb" title="Image Title 1 (jpg)"><img src="tl_files/javascript/tIMG_8966.jpg" alt="" border="0" /></a>
<div class="multiBoxDesc mb1">This is my descrition text 1. It can support html.</div>
<a href="tl_files/javascript/IMG_6608.jpg" id="mb2" class="mb" title="Image Title 2 (jpg)"><img src="tl_files/javascript/tIMG_6608.jpg" alt="" border="0" /></a>
<div class="multiBoxDesc mb2">This is my descrition text 2. It can support html.</div>
<a href="tl_files/javascript/IMG_7210.jpg" id="mb3" class="mb" title="Image Title 3 (jpg)"><img src="tl_files/javascript/tIMG_7210.jpg" alt="" border="0" /></a>
<div class="multiBoxDesc mb3">This is my descrition text 3. It can support html.</div><br />
<div class="multiBoxDesc mb7">real example</div><br />
<a href="tl_files/javascript/blank.htm" rel="width:400,height:300" id="mb9" class="mb" title="iFrame">HTML page</a>
<div class="multiBoxDesc mb9">html</div><br />
<a href="tl_files/javascript/blank-ajax.htm" rel="width:400,height:300,ajax:true" id="mb10" class="mb" title="AJAX">HTML page (Ajax)</a>
<div class="multiBoxDesc mb10">html (ajax)</div><br />
<a href="#htmlElement" rel="type:element" id="mb11" class="mb" title="HTML element">HTML</a>
<div class="multiBoxDesc mb11">html element</div><br />
<div id="htmlElement"><p>This is a snipet of html.</p><ul><li>list item 1</li><li>list item 2</li></ul></div>
<a href="http://www.bbc.co.uk" rel="width:400,height:300" id="mb12" class="mb" title="iFrame">bbc.co.uk</a>
<div class="multiBoxDesc mb12">google</div><br />
</div>

Les images ou pages html proposées sont bien reconnus mais lorsque je clique sur les liens, ils me renvoient sur l'adresse de l'image ou de la page mais aucun effet.

J'avoue que je ne suis pas du tout familier avec les effets lightbox, je ne sais pas du tout ce que j'ai fait de travers et je ne trouve pas d'explication supplémentaire.
Je vous remercie par avance beaucoup de votre aide car je suis dans le brouillard complet.

Reply

Marsh Posté le 12-09-2009 à 10:24:55

Reply

Marsh Posté le 13-09-2009 à 00:14:25

Vu que ce problème n'a pas l'air facile : si ces scripts ne vous sont pas familiers, en utilisez vous d'autres du même type.

Reply

effet lightbox (mutlibox ou squeezebox)

Sujets relatifs:

Leave a Replay