Problème de Javascript
Résolu
Gloubinours91
Messages postés
371
Date d'inscription
Statut
Membre
Dernière intervention
-
Gloubinours91 Messages postés 371 Date d'inscription Statut Membre Dernière intervention -
Gloubinours91 Messages postés 371 Date d'inscription Statut Membre Dernière intervention -
Bonjour à tous et à toutes,
Je suis actuellement en phase de test pour un site que je voudrais lancer prochainement, et j'ai dans l'idée de créer une barre de défilement d'icone comme un dock mac semblable au dock sur RocketDock.com
Malheureusement, j'ai trouvé un code qui ne marche pas chez moi. Il était tout d'abord en HTML et ne fonctionnait qu'avec des sites sans doctype, chose indispensable, et quelqu'un la modifier en XHTML. Voici la source: http://www.javascriptfr.com
J'ai donc essayé de remplacer par un javascript valide pour un doctype XHTML mais toujours rien. Pouvez-vous m'aider?
PS: Voici mes codes: http://www.blocnotesenligne.com/Gloubi
Merci d'avance à tous,
Gloubi.
Je suis actuellement en phase de test pour un site que je voudrais lancer prochainement, et j'ai dans l'idée de créer une barre de défilement d'icone comme un dock mac semblable au dock sur RocketDock.com
Malheureusement, j'ai trouvé un code qui ne marche pas chez moi. Il était tout d'abord en HTML et ne fonctionnait qu'avec des sites sans doctype, chose indispensable, et quelqu'un la modifier en XHTML. Voici la source: http://www.javascriptfr.com
J'ai donc essayé de remplacer par un javascript valide pour un doctype XHTML mais toujours rien. Pouvez-vous m'aider?
PS: Voici mes codes: http://www.blocnotesenligne.com/Gloubi
Merci d'avance à tous,
Gloubi.
A voir également:
- Problème de Javascript
- Telecharger javascript - Télécharger - Langages
- A javascript error occurred in the main process - Forum Handicap / Accessibilté
- Erreur #125 javascript - Forum Mozilla Firefox
- Afficher un tableau javascript en html ✓ - Forum Javascript
- Javascript arrondi - Forum Javascript
7 réponses
Si je ne m'abuse :
Il manque un morceau là... Ca risque difficilement de marcher.
Un "var" au début de chaque définition et ça ira mieux, je pense.
Sinon, pour t'aider en Javascript, je te conseille d'installer Firebug, excellente extension pour firefox pour débugger ses scripts.
for(i=0 ; i
{
Il manque un morceau là... Ca risque difficilement de marcher.
MIN = 33 ; // largeur minimum en pixel MAX = 115 ; // largeur maximum en pixel REACTION = 1.2 ; // réaction des icons par rapport à la souris. plus grand --> plus d'icons qui réagissent A = ((MIN-MAX)/(MAX * REACTION)) ; // coef directeur de la droite d'agrandissement IE = document.all ? 1 : 0 ; img_tags = new Array();
Un "var" au début de chaque définition et ça ira mieux, je pense.
Sinon, pour t'aider en Javascript, je te conseille d'installer Firebug, excellente extension pour firefox pour débugger ses scripts.
Argh, ma réponse a disparu.
Bon, deux points :
1 - déclaration des variables au début : un var devant chacune d'entre elle devrait faire du bien !
2 - la boucle plus bas :
for(i=0 ; i
{
Il manque un morceau....
Par ailleurs, je te conseille d'installer l'extension firebug pour firefox, qui est vraiment un must-have pour le débuggage de script.
Bon, deux points :
1 - déclaration des variables au début : un var devant chacune d'entre elle devrait faire du bien !
2 - la boucle plus bas :
for(i=0 ; i
{
Il manque un morceau....
Par ailleurs, je te conseille d'installer l'extension firebug pour firefox, qui est vraiment un must-have pour le débuggage de script.
Je ne sais pas ce qu'il se passe le forum doit beuguer, je m'excuse auprès de ceux qui m'ont répondu, dans mes mails ils y a le texte, merci à eux je test et je répond.
PS: Impossible d'edit mon précédent message :S
PS: Impossible d'edit mon précédent message :S
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Compare ton Javascript au code initial... Un paquet de caractère a disparu (des +, des morceaux de ligne, etc.)
Par ailleurs, tu définis la taille des images à l'arrache :
Première amélioration possible :
Seconde étape :
Par ailleurs, tu définis la taille des images à l'arrache :
<img src="images/skinstudio.png" width="33" height="33" border="0" align="top">
Première amélioration possible :
<img src="images/skinstudio.png" style="width=33 px; height=33 px; border=none; vertical-align=top;">
Seconde étape :
<img src="images/skinstudio.png"/>et du CSS :
img {
width=33 px;
height=33 px;
border=none;
vertical-align=top;
}
Erf, le site BlocnoteenLigne est nul, il m'oublie pleins de trucs, ça beug!
Voilà un fichier .txt bloc note avec mon codage.
http://oron.com/i0hopzovi32i/CCM_Problème.txt.html
Ce code comporte plus d'éléments, et il ne marche toujours pas. Merci d'avance.
Voilà un fichier .txt bloc note avec mon codage.
http://oron.com/i0hopzovi32i/CCM_Problème.txt.html
Ce code comporte plus d'éléments, et il ne marche toujours pas. Merci d'avance.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<title>Titre de mon site</title>
<meta name="keywords" lang="fr" content="motcle1,mocle2" />
<meta name="description" content="Description de ma page web." />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="fr" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<link rel="icon" type="image/png" href="/images/pipfavicon.png" />
<script language="javascript">
// <![CDATA[
MIN = 33 ; // largeur minimum en pixel
MAX = 115 ; // largeur maximum en pixel
REACTION = 1.2 ; // réaction des icons par rapport à la souris. plus grand --> plus d'icons qui réagissent
A = ((MIN-MAX)/(MAX * REACTION)) ; // coef directeur de la droite d'agrandissement
IE = document.all ? 1 : 0 ;
img_tags = new Array();
function ouEstMaSouris(e)
{
var dock = document.getElementById('dock') ; // div qui contient la barre de menu.
var x = 0;
if (IE) x = e.clientX ; // coordonnées x de la souris sur IE 5.5
else x = e.pageX ; // coordonnées x de la souris sur Mozilla ou Netscape 7
x -= dock.offsetLeft ; // on modifie la coordonnée pour quelle soit relatif au div et non à la fenetre.
img_tags = dock.getElementsByTagName('img') ; // les images contenus dans le div
for(i=0 ; i<img_tags.length ; i++) // pour chaque images
{
millieu = img_tags[i].offsetLeft + parseInt(img_tags[i].style.width)/2 ;
delta = millieu - x ;
if (delta < 0) delta *= -1 ;
coef = A * delta + MAX ;
if (coef < MIN) coef = MIN ;
else if (coef > MAX) coef = MAX ;
img_tags[i].style.width=coef + "px";
img_tags[i].style.height=coef + "px";
}
}
// ]]>
</script>
</head>
<body>
<!-- Déclaration du DIV contenant le menu -->
<!-- 'top' et 'left' peuvent etre modifié pour placer le menu ailleurs (10,10 est le haut à gauche) -->
<!-- 'fixed' fixe le menu (il ne suit pas la scrollbar) et peut etre modifié en 'absolute' (suit la scrollbar) -->
<div style="position:fixed;top=10;left:10;" id="dock" onmousemove="ouEstMaSouris(event)">
<!-- 'width' et 'height' sont à la taille minimum -->
<a href="#" title="Firefox"><img src="images/firefox.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
<a href="#" title="Thunderbird"><img src="images/thunderbird.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
<a href="#" title="MySQL Manager"><img src="images/mysqlmanager.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
<a href="#" title="Paintshop pro 8"><img src="images/psp8.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
<a href="#" title="Object Media"><img src="images/objectmedia.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
<a href="#" title="Settings"><img src="images/settings.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
<a href="#" title="Skin studio"><img src="images/skinstudio.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
<a href="#" title="Stardock central"><img src="images/stardock_central.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
<a href="#" title="Theme manager"><img src="images/theme_manager.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
</div>
</div>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<title>Titre de mon site</title>
<meta name="keywords" lang="fr" content="motcle1,mocle2" />
<meta name="description" content="Description de ma page web." />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="fr" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<link rel="icon" type="image/png" href="/images/pipfavicon.png" />
<script language="javascript">
// <![CDATA[
MIN = 33 ; // largeur minimum en pixel
MAX = 115 ; // largeur maximum en pixel
REACTION = 1.2 ; // réaction des icons par rapport à la souris. plus grand --> plus d'icons qui réagissent
A = ((MIN-MAX)/(MAX * REACTION)) ; // coef directeur de la droite d'agrandissement
IE = document.all ? 1 : 0 ;
img_tags = new Array();
function ouEstMaSouris(e)
{
var dock = document.getElementById('dock') ; // div qui contient la barre de menu.
var x = 0;
if (IE) x = e.clientX ; // coordonnées x de la souris sur IE 5.5
else x = e.pageX ; // coordonnées x de la souris sur Mozilla ou Netscape 7
x -= dock.offsetLeft ; // on modifie la coordonnée pour quelle soit relatif au div et non à la fenetre.
img_tags = dock.getElementsByTagName('img') ; // les images contenus dans le div
for(i=0 ; i<img_tags.length ; i++) // pour chaque images
{
millieu = img_tags[i].offsetLeft + parseInt(img_tags[i].style.width)/2 ;
delta = millieu - x ;
if (delta < 0) delta *= -1 ;
coef = A * delta + MAX ;
if (coef < MIN) coef = MIN ;
else if (coef > MAX) coef = MAX ;
img_tags[i].style.width=coef + "px";
img_tags[i].style.height=coef + "px";
}
}
// ]]>
</script>
</head>
<body>
<!-- Déclaration du DIV contenant le menu -->
<!-- 'top' et 'left' peuvent etre modifié pour placer le menu ailleurs (10,10 est le haut à gauche) -->
<!-- 'fixed' fixe le menu (il ne suit pas la scrollbar) et peut etre modifié en 'absolute' (suit la scrollbar) -->
<div style="position:fixed;top=10;left:10;" id="dock" onmousemove="ouEstMaSouris(event)">
<!-- 'width' et 'height' sont à la taille minimum -->
<a href="#" title="Firefox"><img src="images/firefox.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
<a href="#" title="Thunderbird"><img src="images/thunderbird.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
<a href="#" title="MySQL Manager"><img src="images/mysqlmanager.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
<a href="#" title="Paintshop pro 8"><img src="images/psp8.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
<a href="#" title="Object Media"><img src="images/objectmedia.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
<a href="#" title="Settings"><img src="images/settings.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
<a href="#" title="Skin studio"><img src="images/skinstudio.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
<a href="#" title="Stardock central"><img src="images/stardock_central.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
<a href="#" title="Theme manager"><img src="images/theme_manager.png" style="width=33 px; height=33 px; border=none; vertical-align=top;"/></a>
</div>
</div>
Rebonsoir à tous,
Voilà j'ai trouvé grâce à quelqu'un d'un forum de javascript!
Laugarhraun t'était pas loin du tout!
Voici le code qui me faisait défaut c'était l'image, mon javascript était bon!
<a href="#" title="Firefox"><img class="dock" src="images/firefox.png" style="width:33px; height:33px; border:0; vertical-align:top;"/></a>
JE VOUS REMERCIE TOUS POUR VOTRE AIDE!
Gloubi (Très content!)
Voilà j'ai trouvé grâce à quelqu'un d'un forum de javascript!
Laugarhraun t'était pas loin du tout!
Voici le code qui me faisait défaut c'était l'image, mon javascript était bon!
<a href="#" title="Firefox"><img class="dock" src="images/firefox.png" style="width:33px; height:33px; border:0; vertical-align:top;"/></a>
JE VOUS REMERCIE TOUS POUR VOTRE AIDE!
Gloubi (Très content!)
Tout d'abord merci à vous et à Laug' qui m'avez tous les deux donnez deux réponses semblables. Cependant je ne comprends pas comment utiliser firebug et encore moins corriger moi même mon script!
Pourriez-vous m'aider un peu plus? Merci grandement par avance!
Gloubi.