[javascript] modif de script please help

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : [javascript] modif de script please help

isotop

www.jackyproject.ht.st

bonjour tout l'monde

voila j'ai fait un site ou il y a beaucoup d'images

images que je fait visualiser via un script qui ouvre l'image qui est sous le curseur dans une fenetre sur la meme frame

voir exemple :

http://jackyproject.free.fr/Pages/Photos/PorteAR.htm

le probleme de ce script est que les images en bas de page ou a droite ne sont plus visible

je cherche a ce que l'image s'ouvre toujours de la meme maniere mais au lieu qu'elle suive la souris elle s'ouvre au milieu de la fenetre

exemple de code:

pour afficher l'image
<A onmouseover="return overlib('<IMG BORDER=1 SRC=../../Photos/33/01.JPG border=1 vspace=1 hspace=1> ')" onmouseout=nd()>
<IMG height=150 src="../../Photos/33/01.JPG" width=200></A>

en referance au fichier js
<DIV id=overDiv style="Z-INDEX: 1; POSITION: absolute"></DIV>
<SCRIPT language=JavaScript src="../../overlib.js"></SCRIPT>

si on change la valeur "absolute" l'image ne suis plus la souris mais s'ouvre en bas de page
(ce que je ne cherche pas a faire)

lien vers le fichier js
http://jackyproject.free.fr/overlib.js

ce serais simpa de m'aider a modifier ce script
ou si vous en conaisez un autre qui pourrais faire l'affaire

merci
a+

Publicité

yoyo354

Yoyo, le roi du ...

[:akt]

C'est pas du tout accessible tout ça [:athlonmp]

---------------
http://yoyo.eurotchat.net -> Wednesday 14 September a 02:00:01 up 43 days, 11:47, 2 users, load average: 0.07, 0.03, 0.00

isotop

www.jackyproject.ht.st

ouais je sais c'est un peu bordelique

alors je vais faire un exemple d'une page simple avec une seule photo
"
voici le code de la page (en imaginant que le fichier "overlib.js" soit enregistré dans le meme repertoire que cette page)

<HTML>
<HEAD>
<TITLE>No Title</TITLE>
</HEAD>
<BODY>
<A onmouseover="return overlib('<IMG BORDER=1 SRC=01.jpg>')" onmouseout=nd()>
<IMG height=150 src="01.jpg" width=200></A>

<DIV id=overDiv style="Z-INDEX: 1; POSITION: absolute"></DIV>
<SCRIPT language=JavaScript src="overlib.js"></SCRIPT>
</BODY>
</HTML>

voila

je vais pas vous detailer le fichier "overlib.js" car il est super long

Message édité par isotop le 28-06-2005 à 08:48:19

isotop

www.jackyproject.ht.st

cette ligne :

<DIV id=overDiv style="Z-INDEX: 1; POSITION: absolute"></DIV>

a l'air de controler l'image car si l'on change la valeur de POSITION l'image ne s'ouvre plus par dessus les autres mais en fin de page

bien sur je ne connait pas les autres valeurs que peut prendre POSITION

mais au faite c'est quoi une balise <DIV>

plainsofpain

Pingouino's lover

Euh, l'overlib c'est pourri hein ^^'

Fais une popup accessible au clic genre :

Code :

<a href="grandpouet.jpg" onclick="return(window.open(this.href));">
<img src="minipouet.jpg" alt="pouet" title="Image de pouet" />
</a>

Message édité par plainsofpain le 28-06-2005 à 10:18:10

---------------
http://www.alsacreations.com , http://www.openweb.eu.org. Mon CV : http://cv.roane-irkana.net/. Exemple à ne surtout pas suivre : www.worldinternet.be

FlorentG

Ouais, y'a pas pire que l'overlib niveau lourdeur et inacessibilité

denzz

huhuuuuu ! (désolé )

oula kler pour mettre des images c assez relou à l'utilisation !!!

plainsofpain

Pingouino's lover

Si seulement l'overlib n'était lourde qu'a l'utilisation

---------------
http://www.alsacreations.com , http://www.openweb.eu.org. Mon CV : http://cv.roane-irkana.net/. Exemple à ne surtout pas suivre : www.worldinternet.be

isotop

www.jackyproject.ht.st

plainsofpain a écrit :

Euh, l'overlib c'est pourri hein ^^'

Fais une popup accessible au clic genre :

Code :

<a href="grandpouet.jpg" onclick="return(window.open(this.href));">
<img src="minipouet.jpg" alt="pouet" title="Image de pouet" />
</a>

ouais je crois que ça va finir comme ça
domage j'aimais bien le principe

plainsofpain

Pingouino's lover

bof ... ca faisait un chargement plus long de la page.

Tu crées des miniatures de tes images que tu mets en lien (voire tu les génères avec gd s'il y a du php).

---------------
http://www.alsacreations.com , http://www.openweb.eu.org. Mon CV : http://cv.roane-irkana.net/. Exemple à ne surtout pas suivre : www.worldinternet.be

Publicité

isotop

www.jackyproject.ht.st

pas besoin si je leur donne une taille directement a l'affichage

comme ça

Code :

<a href="grandpouet.jpg" onclick="return(window.open(this.href));">
<img src="minipouet.jpg" height=150 width=200 alt="pouet" title="Image de pouet" />
</a>

FlorentG

Ouais, et ça fait comme tous ces sites, où à la place d'une miniature censée être légère et donner un aperçu, t'as un machin qui fait du 2048*1536, et qui est tout juste redimensionné à l'arrache comme ça [:moule_bite]

Donc tu es obligé de faire une version minitature de l'image finale

isotop

www.jackyproject.ht.st

FlorentG a écrit :

ok ok pas taper

de toutes façon les miniatures sont deja faites
car c'est le principe que j'utilisait avant (voir les autres pages de mon site)

sauf que je les ouvrais dans une nouvelle page et non pas par popup

masklinn

í dag viðrar vel til loftárása

Ca doit aussi être faisable indoc, pas besoin de popups externes ^^

---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody

isotop

www.jackyproject.ht.st

bon j'ai trouve autre chose
presque pareil mais sans l'overlib

il faut cliquer sur les photos cette fois et il les ouvres de la même manière que tout a l'heure je peux déterminer la position d'ouverture de la fenêtre donc impeccable
j'ai eu le script ici

http://www.g1script.com/home/LANGA [...] php?id=415

le seul truc que je voudrais modifier c'est la barre en haut de l'image ouverte dans laquelle ce trouve le lien pour fermer cette image

voir photo

je voudrais virer cette barre (ça c'est pas dur)

mais je voudrais faire en sorte que lorsqu'on clique sur l'agrandissement il se ferme

je vous donne le code de cette barre et du fermer

Code :

function enlarge(which, e, position, imgwidth, imgheight)
{
if (ie||ns6)
{
crossobj=document.getElementById? document.getElementById("showimage" ) : document.all.showimage
var horzpos=ns6? pageXOffset+e.clientX : ietruebody().scrollLeft+192
var vertpos=ns6? pageYOffset+e.clientY : ietruebody().scrollTop+100
crossobj.style.left=horzpos+"px"
crossobj.style.top=vertpos+"px"
crossobj.style.visibility="visible"
crossobj.innerHTML='<div align="right" id="dragbar"><span onClick="closepreview()">Fermer</span> </div><img src="'+which+'">'
return false
}
else
return true
}
function closepreview()
{
crossobj.style.visibility="hidden"
}

c'est a cette ligne la que ça ce passe:
crossobj.innerHTML='<div align="right" id="dragbar"><span onClick="closepreview()">Fermer</span> </div><img src="'+which+'">'

lorsqu'on clique sur fermer on appel la fontion closepreview()

je voudrais l'appeler en cliquant sur la fenetre tou betement
mais j'ai beau essayer dans tout les sens ça ne marche pas

isotop

www.jackyproject.ht.st

rooh allé je suis sur que vous savez

je suis sur que c possible et qu'il n'y a pas grand chose a changer

FlorentG

Franchement... C'est VRAIMENT pas compliqué. Si tu connais un tout petit peu l'HTML...

isotop

www.jackyproject.ht.st

je suis sur que ce n'est pas tres compliqué et que c'est sous mes yeux
le truc c'est que les balises <DIV> et <SPAN> je ne sais pas ce que c'est

gatsusat

ah oui on est mal barré déjà

FlorentG

Et bien ? Quand tu ne sais pas un truc, tu te documentes [:itm] . En l'occurrence, la recommandation HTML 4 [:spamafote]

isotop

www.jackyproject.ht.st

j'ai trouve ça dessus
http://www.le-webmestre.net/web/co [...] urs_10.php
mais ça m'aide pas trop

isotop

www.jackyproject.ht.st

allé "FlorentG" un indice

FlorentG

Analysons la chose :
<div align="right" id="dragbar"><span onClick="closepreview()">Fermer</span> </div><img src="'+which+'">'

<div align="right">

Bon ici, apparemment, on a un machin, dont on peut supposer que l'alignement est à droite

<span onClick="closepreview()">Fermer</span>

Là, un autre truc. En lisant, on peut voir un 'onclick', qui peut spécifier qu'en cas de clickage, il se passe quelque chose, en l'occurence 'closepreview', donc 'fermer aperçu'. Ah. Intéressant

<img src="'+which+'">

Hmmmm... img doit vouloir dire image, donc c'est notre image.

Bon, on veut virer le fermer, tout en gardant le click. Donc avec un peu de logique et 2-3 essais, on vire le div et le span, puis on copie/colle le onclick sur l'image :

Maintenant faut essayer, je sais pas comment est goupillé le script...

isotop

www.jackyproject.ht.st

purée ct si simple que ça
je savais pas que img suportais le onClick

grand merci FlorentG

isotop

www.jackyproject.ht.st

donc pour ceux que ça interesse voici du code final

Code :

<html>
<head>
<title>Nouvelle page 2</title>
<style type="text/css">
#showimage
{
position:absolute;
visibility:hidden;
border: 1px solid gray;
}
</style>
<SCRIPT type="text/javascript" title="JackyScript">
var ie=document.all
var ns6=document.getElementById&&!document.all
function ietruebody()
{
return (document.compatMode!="BackCompat" )? document.documentElement : document.body
}
function enlarge(which, e, position, imgwidth, imgheight)
{
if (ie||ns6)
{
crossobj=document.getElementById? document.getElementById("showimage" ) : document.all.showimage
var horzpos=ns6? pageXOffset+e.clientX : ietruebody().scrollLeft+192
var vertpos=ns6? pageYOffset+e.clientY : ietruebody().scrollTop+100
crossobj.style.left=horzpos+"px"
crossobj.style.top=vertpos+"px"
crossobj.style.visibility="visible"
crossobj.innerHTML='<img onClick="closepreview()" style="cursor:hand" src="'+which+'">'
return false
}
else
return true
}
function closepreview()
{
crossobj.style.visibility="hidden"
}
</SCRIPT>
</head>
<body>
<SCRIPT type="text/javascript" title="JackyScript">
</SCRIPT>
<div id="showimage"></div>
<a href="01a.JPG" onClick="return enlarge('01a.JPG',event)">
<img src="01b.JPG" border="0"></a>
</body>
</html>

O1a.JPG est l'image en haute resolution
01b.JPG est l'image en petite resolution

encore merci pour le coup de main FlorentG

Message édité par isotop le 01-07-2005 à 16:14:11

isotop

www.jackyproject.ht.st

Petite précision

Les valeurs 192 et 100 lignes 31 et 32

Permettent de déterminer l'endroit ou va s'ouvrir l'image
Ils représentent le coin supérieur gauche de l'image

masklinn

í dag viðrar vel til loftárása

Ca se code plus comme ça le javascript maintenant, tu sais...

---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody

Publicité

FORUM HardWare.fr

Programmation

HTML/CSS

[javascript] modif de script please help

Sujets relatifs
Javascript dans un formulaire, trucs qui se déclenchent tout seuls	[Javascript] Combo box choix multiple
Transmettre variables Javascript à PHP	script incompatible MOZ/FIREFOX
FireFox, Javascript et FLASH	Problem MySQL et Phpmyadmin >HELP SVP !!<
script de création de tables	Javascript et php
MySQL : trigger impossible >> PLEASE HELP!
Plus de sujets relatifs à : [javascript] modif de script please help

Page générée en 0.114 secondes