Menu en MooTools => problemes de style pour calque

bonjour,

Je commence à apprendre MooTools, je me suis lancé à faire un menu horizontal.
j'arrive a utiliser le Fx.Slide pour derouler le sous-menu
Par contre je butte sur modifier le style des div, pourtant sa ne parrait pas tres dur !!!!


voici mon mini script :
--------------------

var myVerticalSlide = new Fx.Slide('tweener1').hide();

$('myOtherElement').addEvent('mouseenter', function(e){
		myVerticalSlide.show().slideIn('vertical');
		e.stop();
	});
$('myOtherElement').addEvent('mouseleave', function(fermer){
		myVerticalSlide.show().slideOut('vertical');
		fermer.stop();
	});
	
bon, je pensais modifier avec .setStyles() les div des sous-menu comme ceci :
$('tweener1').setStyles({ top: '100px',  left:'100px',  position: 'absolute',z-index:'900' }); 

sinon je mettre le reglage du style dans le fichier css ou html peut un porte :

<div id="tweener1" style="position: absolute;	
	top: 47px; left: 10px;  /* position fenetre deroulante */
	background: #FFFFFF;
	background-color: #f8f8f8\9; /* le  \9  est un hack pour cibler IE8, IE7 et IE6 */ 
	border-bottom: 1px solid #cbcbcb\9;
	border-left: 1px solid #cbcbcb\9;
	border-right: 1px solid #cbcbcb\9;
	padding: 10px 10px 10px;
	float: left;
	
	border-bottom-right-radius:		    10px;
	-moz-border-radius-bottomright:     10px;
	-khtml-border-radius-bottomright:   10px;
	-webkit-border-bottom-right-radius: 10px;
	
	border-bottom-left-radius:		    10px;
	-moz-border-radius-bottomleft:      10px;
	-khtml-border-radius-bottomleft: 	10px;
	-webkit-border-bottom-left-radius:  10px;
	
	box-shadow:0px 0px 5px #5a5a5a;
	-moz-box-shadow:0px 0px 5px #5a5a5a;
	-webkit-box-shadow:0px 0px 5px #5a5a5a;
	z-index: 800;"> bla bla </div>

Je ne comprends pas pourquoi sa ne fonctionne pas pourtant je lus http://mootools.net et http://davidwalsh.name/ (tres bon site)

pour plus de details sur la programmation voir mon site internet : http://www.construction-materiaux.com/

Merci pour votre aide

bye !
Modifié par drick (28 Oct 2010 - 10:05)

Je m'étais promis de ne pas répondre aux questions qui parlent de «calques» (rappel: il n'y a pas de calques en HTML, en CSS ou en JavaScript... pas de calques du tout, ça n'existe pas, rien à voir avec la choucroute), mais bon.

drick a écrit :
sinon je mettre le reglage du style dans le fichier css ou html peut un porte

Alors si, ça importe. (Rien à voir avec une porte. )
- Autant de code dans un attribut style, c'est crade.
- Si tu as deux éléments différents qui utilisent le même style, tu te retrouves à dupliquer tout ton code CSS.
- Jamais entendu parler du principe de séparation du contenu (HTML) et de la mise en forme (CSS)? C'est une bonne pratique en intégration web.
- À ma connaissance l'attribut style n'admet pas les commentaires CSS, donc tu as sans doute une belle erreur de parsing avec ton code. Si en plus tu utilises des hacks CSS (qui, par définition, exploitent des erreurs de parsing), tu multiplies les risques.

Donc: jamais de la vie autant de code CSS dans un attribut style.

drick a écrit :
Par contre je butte sur modifier le style des div

OK. Mais tu ne dis pas quel problème tu as exactement (en dehors de «ça marche pas comme je veux»), et ce que tu souhaites obtenir.

PS: peux-tu modifier ton message ci-dessus (via le bouton «éditer» en haut à droite une fois que tu es connecté) pour mettre en forme le bloc de code à l'aide des balises [ code=html] et [ /code] (sans espace après le crochet ouvrant)? Merci d'avance.
Modifié par Florent V. (27 Oct 2010 - 23:29)

bonjour,

Florent V a écrit :
. Autant de code dans un attribut style, c'est crade.
- Si tu as deux éléments différents qui utilisent le même style, tu te retrouves à dupliquer tout ton code CSS.
- Jamais entendu parler du principe de séparation du contenu (HTML) et de la mise en forme (CSS)? C'est une bonne pratique en intégration web.

Je te remercie pour votre réponse, bon si j'ai déjà entendu parlé du fichier CSS, pas de problème , j'ai tout mis dans la div pour pour faire un seul copier coller, car mon css est compresser en zp.
Effectivement tout ce qui est ds le style est ds le fichier css normalement

Florent V a écrit :
.OK. Mais tu ne dis pas quel problème tu as exactement (en dehors de «ça marche pas comme je veux»), et ce que tu souhaites obtenir.

La manipulation du style

bye

nota: je tiens à préciser que votre site a des bons tutos
Modifié par drick (28 Oct 2010 - 10:09)

RE
c'est bon, j'ai trouvé , juste un problème de plugings et de bib, il faut charger mootools-1.2-core-nc.js ET mootools-1.2-more-nc.js

A+
Modifié par drick (29 Oct 2010 - 15:31)