1. Accueil
  2. Forum Codes-Sources
  3. Javascript / DHTML
Sujet Précédent Sujet Suivant

Javascript + doctype incompatible

Résolu
laiin
Messages postés
4
Date d'inscription
mercredi 1 juin 2011
Statut
Membre
Dernière intervention
1 juin 2011
 - 1 juin 2011 à 14:28
smathis
Messages postés
153
Date d'inscription
lundi 22 mars 2010
Statut
Membre
Dernière intervention
17 juin 2011
 - 3 juin 2011 à 09:18
Bonjour, nayant aucune connaisance en javascript j'ai telecharger un script pour avoir un menu deroulant et qui suit la page(lui===> http://futurisnow.elementfx.com/ )
le problème est que quand j’insère un doctype le menu reste fix

apres quelque recherche j'ai vue que ce menu utilise des fonction que l'on utilise plus haujourd'hui, notament le documents.write

aussi le gars qui a mis le script c'est fait chier a faire tout un tas de tableau, cela n'aurait pas etait plus simple de faire que 2 tableau ?(1 pour les lien et 1 pour la barre de droite ?)


quelqu'un connaiterai le même en plus recent (compatible doctype recent et utilisant du DOM)

j'ai esseyer de me lancer dans l'aprentissage du javascript mais je n'aime pas du tout se language (meme si a 1er vue les if else while etc.. me fesai penser a du c)

8 réponses

Réponse 1 / 8
cs_jopop
Messages postés
1540
Date d'inscription
lundi 26 mai 2003
Statut
Membre
Dernière intervention
1 août 2013
 12
1 juin 2011 à 15:14
Salut,

que tu aimes ou pas le Javascript tu vas pas avoir le choix que de t'y plonger si tu veux comprendre et modifier un tel script client.

Pour des scripts JS récents qui font plein "good stuff" je te conseille de regarder du côté de JQuery/JQueryUI (tape ça dans google, y'a plein de sites qui en causent).
3
Réponse 2 / 8
laiin
Messages postés
4
Date d'inscription
mercredi 1 juin 2011
Statut
Membre
Dernière intervention
1 juin 2011
1 juin 2011 à 14:29 
//Static Slide Menu 6.5 © MaXimuS 2000-2001, All Rights Reserved.
//Site: http://www.absolutegb.com/maximus
//E-mail: maximus@nsimail.com
//Script featured on Dynamic Drive (http://www.dynamicdrive.com)

NS6 =  (document.getElementById&&!document.all)
IE = (document.all)
NS = (navigator.appName=="Netscape" && navigator.appVersion.charAt(0)=="4")

tempBar='';barBuilt=0;ssmItems=new Array();


moving=setTimeout('null',1)
function moveOut() {
if ((NS6||NS)&&parseInt(ssm.left)<0 || IE && ssm.pixelLeft<0) {
clearTimeout(moving);moving = setTimeout('moveOut()', slideSpeed);slideMenu(10)}
else {clearTimeout(moving);moving=setTimeout('null',1)}};
function moveBack() {clearTimeout(moving);moving = setTimeout('moveBack1()', waitTime)}
function moveBack1() {
if ((NS6||NS) && parseInt(ssm.left)>(-menuWidth) || IE && ssm.pixelLeft>(-menuWidth)) {
clearTimeout(moving);moving = setTimeout('moveBack1()', slideSpeed);slideMenu(-10)}
else {clearTimeout(moving);moving=setTimeout('null',1)}}
function slideMenu(num){
if (IE) {ssm.pixelLeft += num;}
if (NS||NS6) {ssm.left = parseInt(ssm.left)+num;}
if (NS) {bssm.clip.right+=num;bssm2.clip.right+=num;}}

function makeStatic() {
if (NS||NS6) {winY = window.pageYOffset;}
if (IE) {winY = document.body.scrollTop;}
if (NS6||IE||NS) {
if (winY!=lastY&&winY>YOffset-staticYOffset) {
smooth = .2 * (winY - lastY - YOffset + staticYOffset);}
else if (YOffset-staticYOffset+lastY>YOffset-staticYOffset) {
smooth = .2 * (winY - lastY - (YOffset-(YOffset-winY)));}
else {smooth=0}
if(smooth > 0) smooth = Math.ceil(smooth);
else smooth = Math.floor(smooth);
if (IE) bssm.pixelTop+=smooth;
if (NS6||NS) bssm.top=parseInt(bssm.top)+smooth
lastY = lastY+smooth;
setTimeout('makeStatic()', 1)}}

function buildBar() {
if(barText.indexOf('-1) {tempBar=barText}
else{for (b=0;b '+tempBar+' 

</TD>')}

function initSlide() {
if (NS6){
ssm =document.getElementById("thessm").style;
bssm= document.getElementById("basessm").style;
bssm.clip="rect(0 "+document.getElementById("thessm").offsetWidth+" "+document.getElementById("thessm").offsetHeight+" 0)";ssm.visibility="visible";
}else if (IE) {
ssm=document.all("thessm").style;
bssm=document.all("basessm").style;
bssm.clip="rect(0 "+thessm.offsetWidth+" "+thessm.offsetHeight+" 0)";bssm.visibility = "visible";
}else if (NS) {
bssm=document.layers["basessm1"];
bssm2=bssm.document.layers["basessm2"];ssm=bssm2.document.layers["thessm"];
bssm2.clip.left=0;ssm.visibility = "show";
}
if (menuIsStatic=="yes")
makeStatic();
}

function buildMenu() {
if (IE||NS6) {
document.write('

');
}
if (NS) {
document.write('<LAYER name="basessm1" top="'+YOffset+'" LEFT='+XOffset+' visibility="show"><LAYER visibility="hide" name="thessm" bgcolor="'+menuBGColor+'" left="'+(-menuWidth)+'" onmouseover="moveOut()" onmouseout="moveBack()">');
}
if (NS6){
document.write('');
}
document.write('<table border="0" cellpadding="0" cellspacing="1" width="'+(menuWidth+barWidth+2)+'" bgcolor="'+menuBGColor+'">');
for(i=0;i<ssmItems.length;i++) {
if(!ssmItems[i][3]){
ssmItems[i][3]=menuCols;
ssmItems[i][5]=menuWidth-1;
}else if(ssmItems[i][3]!=menuCols)
ssmItems[i][5]=Math.round(menuWidth*(ssmItems[i][3]/menuCols)-1);
if ( ssmItems[i-1] && ssmItems[i-1][4] != "no" ) {

document.write('----
');
}
if(!ssmItems[i][1]){
document.write(',   '+ssmItems[i][0]+' </td>');
}else {
if(!ssmItems[i][2])
ssmItems[i][2] =linkTarget;
document.write('<LAYER onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%" ALIGN="'+linkAlign+'">
 '+ssmItems[i][0]+'
</LAYER>, ');
}
if(ssmItems[i][4]!=\"no\"&&barBuilt==0){
buildBar();
barBuilt=1;
}
if(ssmItems[i][4]!=\"no\"){
document.write('');
}
}
document.write('
');
if (NS6){
document.write('</TD></TR></TABLE>');
}
if (IE||NS6) {
document.write('

');
}
if (NS) {
document.write('</LAYER></LAYER>');
}
theleft=-menuWidth;lastY=0;setTimeout('initSlide();', 1);
}


<!--



/*

Configure menu styles below

NOTE: To edit the link colors, go to the STYLE tags and edit the ssm2Items colors

*/



b=(screen.width==800&&screen.height==600);


if(b) YOffset=0;
else YOffset=10; // no quotes!!
XOffset=0;
staticYOffset=6; // no quotes!!
slideSpeed=20 // no quotes!!
waitTime=100; // no quotes!! this sets the time the menu stays out for after the mouse goes off it.
menuBGColor="#000000";
menuIsStatic="yes"; //this sets whether menu should stay static on the screen
if(b) menuWidth=180;
else menuWidth=180; // Must be a multiple of 10! no quotes!!
menuCols=0;
hdrFontFamily="verdana";
if(b) hdrFontSize="5";
else hdrFontSize="5";
hdrFontColor="#088A4B";
hdrBGColor="#000000";
hdrAlign="center";
hdrVAlign="center";
hdrHeight="15";
linkFontFamily="Arial";
if(b) linkFontSize="5";
else linkFontSize="5";
linkBGColor="#000000";
linkOverBGColor="#000000";
linkTarget="_top";
linkAlign="middle";
barBGColor="#FFFFFF";
barFontFamily="Verdana";
if(b) barFontSize="1";
else barFontSize="3";
barFontColor="#FFFFFF";
barVAlign="center";
barWidth=20; // no quotes!!
barText="SOUS-PROGRAMME"; //  tag supported. Put exact html for an image to show.



///////////////////////////
// ssmItems[...]=[name, link, target, colspan, endrow?] - leave 'link' and 'target' blank to make a header

ssmItems[0]=["GENERAL"] //create header
ssmItems[1]=["Accueille", "http://futurisnow.elementfx.com/",""] //create header
ssmItems[2]=["Forum", "/forum/",""] 
ssmItems[3]=["Me contacté", "contacte.php",""]
ssmItems[4]=["CYBERPUNK", "", ""] //create header
ssmItems[5]=["C'est quoi ?", "cyberpunk",""] 
ssmItems[6]=["film", "film.php", ""]
ssmItems[7]=["Jeux", "jeux.php", ""]
ssmItems[8]=["Manga", "manga.php", ""]
ssmItems[9]=["Livre", "livre.php", ""]



buildMenu();



//-->
0
Réponse 3 / 8
laiin
Messages postés
4
Date d'inscription
mercredi 1 juin 2011
Statut
Membre
Dernière intervention
1 juin 2011
1 juin 2011 à 16:19
re bonjour
merci de cette reponse aussi rapide
j'ai trouver en chercher des menu jquery
celui ci

http://tympanus.net/codrops/2009/11/30/beautiful-slide-out-navigation-a-css-and-jquery-tutorial/

a la base il sert a afficher des images mais en le bidouillant un peu j'ai réussie a afficher du texte

j'ai remplacer 

            $(function() {
                $('#navigation a').stop().animate({'marginLeft':'-85px'},1000);

                $('#navigation > li').hover(
                    function () {
                        $('a',$(this)).stop().animate({'marginLeft':'-2px'},200);
                    },
                    function () {
                        $('a',$(this)).stop().animate({'marginLeft':'-85px'},200);
                    }
                );
            });



par 

            $(function() {
                $('#navigation menu').stop().animate({'marginLeft':'-85px'},1000);

                $('#navigation > li').hover(
                    function () {
                        $('menu',$(this)).stop().animate({'marginLeft':'-2px'},200);
                    },
                    function () {
                        $('menu',$(this)).stop().animate({'marginLeft':'-85px'},200);
                    }
                );
            });
0
Réponse 4 / 8
cs_jopop
Messages postés
1540
Date d'inscription
lundi 26 mai 2003
Statut
Membre
Dernière intervention
1 août 2013
 12
1 juin 2011 à 16:24
Ben tu n'aimes pas le JS mais tu bidouilles déjà du JQuery,
c'est un très bon début ;)
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 8
smathis
Messages postés
153
Date d'inscription
lundi 22 mars 2010
Statut
Membre
Dernière intervention
17 juin 2011
 5
1 juin 2011 à 16:37
Mouè, il faut apprendre à ramper avant de marcher ! Essaye quand même de t'initier au JS
0
Réponse 6 / 8
cs_jopop
Messages postés
1540
Date d'inscription
lundi 26 mai 2003
Statut
Membre
Dernière intervention
1 août 2013
 12
1 juin 2011 à 19:40
smathis n'a pas tort, d'ailleurs moi-même je préfère souvent monter mes propres JS (j'avoue avoir des soucis avec la jquery). Mais comme de plus en plus de dev s'en servent, je me suis dit que c'était une bonne chose de s'y atteler, débutant ou non. Et puis ça correspondait à sa demande. Quand tu veux un truc tout fait qui marche bien, jqueryUI est quand même bien fourni.
0
Réponse 7 / 8
laiin
Messages postés
4
Date d'inscription
mercredi 1 juin 2011
Statut
Membre
Dernière intervention
1 juin 2011
1 juin 2011 à 21:33
j'ai réussi a l’intégrai a mon site si vous voulais voire se que sa donne ^^
http://futurisnow.elementfx.com/

maintenant j'ai le label "This document was successfully checked as HTML5!"
mais le site ne me propose pas de mettre de logo w3c html5 comme j'ai pu lire :(
0
Réponse 8 / 8
smathis
Messages postés
153
Date d'inscription
lundi 22 mars 2010
Statut
Membre
Dernière intervention
17 juin 2011
 5
3 juin 2011 à 09:18
Spécial comme design !
0