[Résolu]Problème avec un script de dockbar type mac OS

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : [Résolu]Problème avec un script de dockbar type mac OS

3tnieS

Bonjour, j'ai trouvé il y a quelques jours un script javascript permettant de réaliser une dockbar type mac OS. Quand on passe sur une image, celle ci s'agrandit.
Pour avoir un exemple regarder ici :
http://h.delaage.free.fr/dockbar/javascript.html

Le script en question est

Code :

// Script JS pour le dock
<!--
MIN = 60 ; // 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;
img_tags[i].style.height=coef;
}
}

Ensuite il ne reste plus qu'a appliquer le code suivant sur les images

Code :

<div id="dock" onmousemove="ouEstMaSouris(event)">
<IMG SRC="./images/#.jpg" style="width:60;height:60;" BORDER="0" align="top">
</div>

Voila jusqu'ici aucun problème le script fonctionne parfaitement.

Cependant je souhaite modifier un peu ce script. En effet dans l'exemple ci-dessus, le zoom s'effectue vers le bas (je sais pas si je suis très clair ).
Cad quand on passe sur une image celle-ci s'aggrandie vers le bas.
Je veux modifier la direction du zoom, lorsque je passe sur mon image je voudrais que celle-ci s'agrandisse vers le haut. Seulement, mes notions en JS sont relativement maigre.
Ne comprenant pas réellement le script, j'ai essayé de bidouillé un peu les variables, d'inverser le coef directeur de la droite d'agrandissement.
Finalement la solution se trouve ici

Code :

<IMG SRC="./images/#.jpg" style="width:60;height:60;" BORDER="0" align="top">

Si on change la valeur d'align en remplacant top, par bottom on obtient ceci :
http://h.delaage.free.fr/dockbar/javascript2.html

Cela correspond a peu près résultat que je souhaite mais il faudrait que ma série d'image reste bloqué sur leur position inférieur.
Je cherche quelqu'un pouvant m'expliquer le fonctionnement du script, afin de faire avancer mon pbm. ( je vous demande pas la réponse mais des conseils pour orienter mes recherches ^^ )

Voila, merci à ceux qui ont pris le tps de tout lire. Si je n'ai pas été clair sur certains points, n'hésitez pas à me demander.

Message édité par 3tnieS le 11-04-2006 à 21:56:44

Publicité

gatsu35

Blablaté par Harko

align="top" sur ton img ca te dit pas quelque chose ça ?

align="bottom" c'est fait pour

3tnieS

Citation :

Si on change la valeur d'align en remplacant top, par bottom on obtient ceci :

http://h.delaage.free.fr/dockbar/javascript2.html

Cela correspond a peu près résultat que je souhaite mais il
faudrait que ma série d'image reste bloqué sur leur position inférieur.

J'ai bien essayé avec align="bottom" mais du coup, la bar se déplace constament. Du coup ca t'explose les yeux

gatsu35

Blablaté par Harko

ouais mais dit toi bien que la barre elle reste en bas

rufo

Pas me confondre avec Lycos!

pas mal ce script

3tnieS

Ué la barre reste bien toujours en bas. Il faudrait donc que je puisse la bloquer sur sa position le plus bas possible. Je tatonne pour la marche à suivre.
C'est possible de spécifier les coordonnées horizontal d'une image en JS?
Ou peut-être passer par un positionnement fixe en faisant appel aux feuilles de style CSS ?

Message édité par 3tnieS le 11-04-2006 à 21:04:23

gatsu35

Blablaté par Harko

position absolute ?
bottom 0 ?

3tnieS

Je viens d'essayer avec la position:absolute et bottom:0, ca donne un résultat bizarre.http://h.delaage.free.fr/dockbar/javascript3.html

J'ai essayé avec les autres positionnement css, mais la ca ne change rien du tout.

gatsu35

Blablaté par Harko

c'est sur ton element qui englobe tes images qu'il faut le mettre !!

3tnieS

Ouais c'était bien sur la div entourant les images

Merci pour ton aide,le resultat est exactement comme je voulais: http://h.delaage.free.fr/dockbar/javascript4.html

FORUM HardWare.fr

Programmation

HTML/CSS

[Résolu]Problème avec un script de dockbar type mac OS

Sujets relatifs
[JS] deserialiser du XML....aide sur un script existant :)	[résolu] Supprimer des modules
[Résolu] ViewState	Un seul jeu de script pour plusieurs sites
probleme de rafraichissement de l affichage sous firefox	[ RESOLU ] structure boucle
problème avec la commande "connect to"	probleme lien banniere flash
problème avec la commande xcopy	Probleme avec le controle LEAD dans VB6
Plus de sujets relatifs à : [Résolu]Problème avec un script de dockbar type mac OS

Page générée en 0.065 secondes