Rechercher : dans
Par :

Création du menu lavalamp avec jquery

Dernière réponse le 10 nov 2009 à 23:24:03 tipi75, le 10 nov 2009 à 22:34:04 
 Signaler ce message aux modérateurs

Bonsoir,

J'essaye de faire le menu lavalamp:

http://www.gmarwaha.com/blog/2007/08/23/lavalamp-for-jquery-­lovers/

Mais j'ai un soucis parce que mon animation se déplace bien sauf qu'il y a un autre carré orange qui reste sur le premier lien. J'explique comme je peux mais ce n'est pas évident. Je vous passe un lien que montre à peut près le problème:

http://mbox.tuxfamily.org/slider/

Sur ce lien vous voyez qu'il y a un carré bleu qui ne bouge pas et bah.. moi c'est pareil. ATTENTION: ne faite pas attention au design.

Voici ma partie html:

<div id="menu">
	        <ul class="menu_dessus" id="1">
			 <li class="current"><a href="/">Lien1</a></li>
			 <li><a href="http://blog.arnaud-k.fr">Lien2</a></li>
			 <li><a href="mes-projets.html">Lien3</a></li>
			 <li><a href="http://photos.arnaud-k.fr">Lien4</a></li>
			 <li><a href="http://photos.arnaud-k.fr">Lien5</a></li>
			 <li style="overflow: hidden; left: 90px; width: 100px; display: block;" class="back"><divclass="left"></div></li>
		</ul>
	    </div>



Voici la parti css:

div#menu{
background:#5f8137; 
margin-left:auto;	
margin-right:auto; 
width:100%; 
padding-top:20px; 
padding-bottom:20px;  
}

a, a:visited{ 
color: #5f8137;
outline: none;
text-decoration:none;
font-weight:bold;
}

a:hover{
color:#ef9e27;
}

.menu_dessus {
position: relative;
height: 29px;
width: 1024px;
background: url("../images/bg_2.gif") no-repeat top;
padding: 15px;
margin: 10px 0;
overflow: hidden;
padding-left:90px;
overflow: hidden;
margin:0;
margin-left:auto;
margin-right:auto;
}

.menu_dessus li {
float: left;
list-style: none;
}

.menu_dessus li.back {
background: url("../images/lava.gif") no-repeat right -30px;
width: 9px;
height: 30px;
z-index: 8;
position: absolute;
}

.menu_dessus li.back .left {
background: url("../images/lava.gif") no-repeat top left;
height: 30px;
margin-right: 0px; /* 7px is the width of the rounded shape */
}

.menu_dessus li a {
font: bold 14px arial;
text-decoration: none;
color: #fff;
outline: none;
text-align: center;
top: 7px;
text-transform: uppercase;
letter-spacing: 0;
z-index: 10;
display: block;
float: left;
height: 30px;
position: relative;
overflow: hidden;
margin: auto 10px;    
}

.menu_dessus li a:hover, .menu_dessus li a:active, .menu_dessus li a:visited {
border: none;
 }




Merci de votre aide
Configuration: Windows XP
Firefox 3.5.5

Meilleures réponses pour « création du menu lavalamp avec jquery » dans :
Comment créer une carte de menu de Noël VoirQuoi de plus "fashion" que de présenter une carte/un carton de menu de Noël ! Sympa, élégant, rigolo aussi, c'est selon ! Voici une petite astuce qui vous guidera dans votre création et... votre créativité ! Sommaire Choisir le menu de...
Video AVI avec menu VoirProblème J'ai des films en avi sur mon PC et je voudrais savoir quel programme je dois utiliser pour créer un film (avi, ou n'importe) avec MENU, mais je veux pouvoir le regarder sur mon PC. Solution En principe, les fichiers vidéo du type...

1

tipi75, le 10 nov 2009 à 23:03:37

Personne ne peut m'aider???


Merci d'avance

Répondre à tipi75

2

 tipi75, le 10 nov 2009 à 23:24:03

C'est bon j'ai trouvé mon problème

Répondre à tipi75