Anthony59120 | Bonjour,
Depuis hier soir, j'essaye de bien configurer un script afin de le mettre sur mon site mais sans succès.
Ce script me permet d'afficher un menu avec un effet carrousel.
Le problème est que je n'arrive pas à centrer ce menu, sur ma page d'accueil (que ce soit sur firefox ou IE).
Quelque soit les modifications que j'entreprends dans le script, les icônes s'affichent sur la gauche de mon index alors que le mousse over est quant à lui centrer.
Voici le script :
Code :
- <style> img { border: none; } /* dock - top */ .dock { z-index: 100; background-image: url(''); background-repeat: repeat-y position: relative; height: 50px; text-align: center; } .dock-container { position: absolute; height: 50px; background: url(); padding-left: 20px; } a.dock-item { display: block; width: 40px; color: #000; position: absolute; top: 0px; text-align: center; text-decoration: none; font: bold 12px Arial, Helvetica, sans-serif; } .dock-item img { border: none; margin: 5px 10px 0px; width: 100%; } .dock-item span { display: none; padding-left: 20px; } /* dock2 - bottom */ #dock2 { width: 100%; bottom: 0px; position: absolute; left: 0px; } .dock-container2 { position: absolute; height: 50px; background: url(images/dock-bg.gif); padding-left: 20px; } a.dock-item2 { display: block; font: bold 12px Arial, Helvetica, sans-serif; width: 40px; color: #000; bottom: 0px; position: absolute; text-align: center; text-decoration: none; } .dock-item2 span { display: none; padding-left: 20px; } .dock-item2 img { border: none; margin: 5px 10px 0px; width: 100%; } </style> <script type="text/javascript" src="http://sd-1.archive-host.com/membres/up/37297969143779149/jquery.js"></script> <script type="text/javascript" src="http://sd-1.archive-host.com/membres/up/37297969143779149/interface.js"></script> <!--[if lt IE 7]> <style type="text/css"> div, img { behavior: url(iepngfix.htc) } </style> <![endif]--> <div class="dock" id="dock"> <div class="dock-container"> <a class="dock-item" href="#"><img src="http://sd-1.archive-host.com/membres/images/37297969143779149/images1/home.png" /> <span>Accueil</span> </a> <a class="dock-item" href="#"><img src="http://sd-1.archive-host.com/membres/images/37297969143779149/images1/email.png" /> <span>Email</span> </a> <a class="dock-item" href="#"><img src="http://sd-1.archive-host.com/membres/images/37297969143779149/images1/portfolio.png"/> <span>Document</span> </a> <a class="dock-item" href="#"><img src="http://sd-1.archive-host.com/membres/images/37297969143779149/images1/tutoriel.png" /> <span>Tuto</span> </a> <a class="dock-item" href="#"><img src="http://sd-1.archive-host.com/membres/images/37297969143779149/images1/jours.png" /> <span>Cours</span> </a> <a class="dock-item" href="#"><img src="http://sd-1.archive-host.com/membres/images/37297969143779149/images1/link.png" /> <span>Liens</span><a class="dock-item" href="#"><img src="http://s1. spam.com /2009/10/18/69295502video-png.png" /> <span>Video</span> </a> <a class="dock-item" href="#"><img src="http://s1. spam.com /2009/10/18/36443294newsletter-png.png"/> <span>News</span> </a> <a class="dock-item" href="#"><img src="http://s1. spam.com /2009/10/18/52657116album-photo-png.png" /> <span>Photos</span> </a> <a class="dock-item" href="#"><img src="http://s1. spam.com /2009/10/18/77360071forum-png.png" /> <span>Forum</span> </a> <a class="dock-item" href="#"><img src="http://s1. spam.com /2009/10/18/47409109livre-png.png" /> <span>Livre</span> </a> </div> </div> <script type="text/javascript"> $(document).ready( function() { $('#dock').Fisheye( { maxWidth: 50, items: 'a', itemsText: 'span', container: '.dock-container', itemWidth: 40, proximity: 90, halign : 'center' } ) } ); </script>
|
Merci pour l'aide que vous m'apportez !!! |
Tu crois vraiment qu'on va se prendre la tête à lire un truc pareil. Ca sent à plein nez le bout de code repris qq part et que t'arrives pas à faire fonctionner. Donc merci de voir ça avec le concepteur de ce code.