Tom's Guide > Forum > Programmation > Modification de script pour traitement d'images

Modification de script pour traitement d'images

Forum Programmation : Modification de script pour traitement d'images

TomsGuide.com : 800 000 inscrits répondent à toutes vos questions high-tech et informatique. Pour obtenir de l'aide, inscrivez-vous gratuitement !
Créer un nouveau sujet Répondre
Mot :    Pseudo :           
 
Neophyte1713   28-05-2008 à 14:02:49

Bonjour,

je fais un site ou j'ai besoin de faire un défilement d'images sur le haut de la page ainsi que l'arret du défilement et un zoom de l'image quand on passe la souris dessus.

Et si possible une redirection quand on clique dessus!

J'ai déjà un script fonctionnel qui me permet d'afficher une image et la zoomer lorsque l'on passe la souris dessus.

Il faudrait donc si c'est possible, adapter ce script pour effectuer le défilement et le stop ainsi que la redirection au clique.


Voici le script que j'ai utilisé:



<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- #BeginEditable "doctitle" -->
<title>Contact</title>
<!-- #EndEditable -->
<link href="../styles/style2.css" rel="stylesheet" type="text/css" />

<script language="javascript">
<!--
//PLF-http://www.jejavascript.net/
var coeff=4;//Coefficient de reduction
var larg=300;//largeur maxi de l'image
var haut=300;//hauteur maxi de l'image
var coeffinit=coeff;
function changer() {
if (document.image.width < larg) {
coeff = coeff-0.2;
document.image.width = Math.round(larg/coeff);
document.image.height = Math.round(haut/coeff);
chang=window.setTimeout('changer();',1);//vitesse de l'effet
}
else {window.clearTimeout(chang);}
}
function initial() {
if (document.image.width > larg/coeffinit) {
window.clearTimeout(chang);
coeff = coeff+0.2;
document.image.width = Math.round(larg/coeff);
document.image.height = Math.round(haut/coeff);

initi=window.setTimeout('initial();',1);//vitesse de l'effet
}
else {window.clearTimeout(initi);}
}
//-->
</script>

</head>

<body>

<div align="center">
<a name="img"></a>
<a href="#img" onmouseout="initial()" onmouseover="changer()" onclick="" ><img src="mon image" alt="" name="image"/></a></div>
<script language="javascript">

<!--
//PLF-http://www.jejavascript.net/
document.image.width = Math.round(larg/coeff);
document.image.height = Math.round(haut/coeff);
//-->
</script>


Merci d'avance pour votre aide! :)

Neophyte

Répondre
Liens sponsorisés
Inscrivez-vous ou connectez-vous pour masquer ceci.
SiMax86   30-05-2008 à 16:44:13
- 0 +

Bonjour,
j'espère que j'ai bien compris ce que vous désiriez

Code :
  1. <head>
  2. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  3. <!-- #BeginEditable "doctitle" -->
  4. <title>Contact</title>
  5. <!-- #EndEditable -->
  6. <link href="../styles/style2.css" rel="stylesheet" type="text/css" />
  8. <script language="javascript">
  9. <!--
  10. //PLF-http://www.jejavascript.net/
  11. var coeff=4;//Coefficient de reduction
  12. var larg=300;//largeur maxi de l'image
  13. var haut=300;//hauteur maxi de l'image
  14. var coeffinit=coeff;
  15. function changer() {
  16. if (document.image.width < larg) {
  17. coeff = coeff-0.2;
  18. document.image.width = Math.round(larg/coeff);
  19. document.image.height = Math.round(haut/coeff);
  20. chang=window.setTimeout('changer();',1);//vitesse de l'effet
  21. }
  22. else {window.clearTimeout(chang);}
  23. }
  24. function initial() {
  25. if (document.image.width > larg/coeffinit) {
  26. window.clearTimeout(chang);
  27. coeff = coeff+0.2;
  28. document.image.width = Math.round(larg/coeff);
  29. document.image.height = Math.round(haut/coeff);
  31. initi=window.setTimeout('initial();',1);//vitesse de l'effet
  32. }
  33. else {window.clearTimeout(initi);}
  34. }
  35. //-->
  36. </script>
  38. </head>
  40. <body>
  42. <div align="center">
  43. <a name="img"></a>
  44. <a href="#img" onmouseout="initial()" onmouseover="changer()" onclick="window.location='http://google.fr';" ><img src="mon image" alt="" name="image" border=0 /></a></div>
  45. <script language="javascript">
  47. <!--
  48. //PLF-http://www.jejavascript.net/
  49. document.image.width = Math.round(larg/coeff);
  50. document.image.height = Math.round(haut/coeff);
  51. //-->
  52. </script>

------------------------------ Besoin d'aide informatique/design/web ? Kommunauty !
Referencement gratuit
 Répondre à SiMax86
Neophyte1713   01-06-2008 à 16:55:18
- 0 +

Hello,

Merci ta réponse!

mais il manque encore pour l'ajout de plusieurs images et le défilement des images quand on ne met pas la souris dessus!

Donc si t'arriverai à m'aider encore pour ça, ça serait super cool! :-)

Merci d'avance.

Neophyte


Répondre à Neophyte1713
SiMax86   01-06-2008 à 19:57:07
- 0 +

De rien :)

Pour avoir plusieurs images, il suffit de rajouter le code des images :

Code :
  1. <head>
  2. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  3. <!-- #BeginEditable "doctitle" -->
  4. <title>Contact</title>
  5. <!-- #EndEditable -->
  6. <link href="../styles/style2.css" rel="stylesheet" type="text/css" />
  7. <script language="javascript">
  8. <!--
  9. //PLF-http://www.jejavascript.net/
  10. var coeff=4;//Coefficient de reduction
  11. var larg=300;//largeur maxi de l'image
  12. var haut=300;//hauteur maxi de l'image
  13. var coeffinit=coeff;
  14. function changer() {
  15. if (document.image.width < larg) {
  16. coeff = coeff-0.2;
  17. document.image.width = Math.round(larg/coeff);
  18. document.image.height = Math.round(haut/coeff);
  19. chang=window.setTimeout('changer();',1);//vitesse de l'effet
  20. }
  21. else {window.clearTimeout(chang);}
  22. }
  23. function initial() {
  24. if (document.image.width > larg/coeffinit) {
  25. window.clearTimeout(chang);
  26. coeff = coeff+0.2;
  27. document.image.width = Math.round(larg/coeff);
  28. document.image.height = Math.round(haut/coeff);
  29. initi=window.setTimeout('initial();',1);//vitesse de l'effet
  30. }
  31. else {window.clearTimeout(initi);}
  32. }
  33. //-->
  34. </script>
  35. </head>
  36. <body>
  37. <div align="center">
  38. <a name="img"></a>
  39. // Image 1
  40. <a href="#img" onmouseout="initial()" onmouseover="changer()" onclick="window.location='http://google.fr';" ><img src="mon image" alt="" name="image" border=0 /></a>
  41. // Image 2
  42. <a href="#img" onmouseout="initial()" onmouseover="changer()" onclick="window.location='http://google.fr';" ><img src="mon image" alt="" name="image" border=0 /></a>
  43. // Etc...
  44. </div>
  45. <script language="javascript">
  46. <!--
  47. //PLF-http://www.jejavascript.net/
  48. document.image.width = Math.round(larg/coeff);
  49. document.image.height = Math.round(haut/coeff);
  50. //-->
  51. </script>



Pour le défilement, à vous de trouver un script et de le joindre au script que vous avez déjà

------------------------------ Besoin d'aide informatique/design/web ? Kommunauty !
Referencement gratuit
 Répondre à SiMax86
Neophyte1713   02-06-2008 à 08:50:47
- 0 +

Ok! Merci beaucoup! :)

Je vais voir ce que je peux trouver!

A++

Répondre à Neophyte1713
Neophyte1713   02-06-2008 à 14:30:56
- 0 +

Re-salut!

J'ai testé pour plusieurs images mais, lorsque j'en met une 2ème, les 2 images s'affichent en taille réel sur la page et donc il n y a plus le zoom et tout!

Alors que si j'en met qu'une, l'image est bien réduite au début et peut être zoomée!

si t'as la raison je suis prenant! :-)

Merci

Répondre à Neophyte1713
SiMax86   02-06-2008 à 18:45:46
- 0 +

Oui, j'ai vu mais cela ne marche pas :s

Désolé, je ne sais pas.

Message cité 1 fois
------------------------------ Besoin d'aide informatique/design/web ? Kommunauty !
Referencement gratuit
 Répondre à SiMax86
Neophyte1713   03-06-2008 à 14:39:30
- 0 +

SiMax86 a écrit :

Oui, j'ai vu mais cela ne marche pas :s

Désolé, je ne sais pas.




mmm ben cherche! loool :D

Ben écoute si tu trouve des infos la dessus reviens par ici! ;-)

En attendant je vais chercher un peu partout!

A++

Répondre à Neophyte1713
SiMax86   03-06-2008 à 20:43:11
- 0 +

Ok :)

------------------------------ Besoin d'aide informatique/design/web ? Kommunauty !
Referencement gratuit
 Répondre à SiMax86
Créer un nouveau sujet Répondre
Tom's Guide > Forum > Programmation > Modification de script pour traitement d'images
Aller à :

Il y a 1474 utilisateurs connus et inconnus. Pour voir la liste des connectés connus, cliquez ici.

Plan du forum
Forum Bestofmedia ©
2000-2009 Bestofmedia Group
Page générée en 0,312 secondes
Attention

Vous allez répondre sur un sujet resté inactif pendant plus de 6 mois.
Assurez-vous d'apporter des éléments nouveaux à la discussion avant de poursuivre.

Répondre Annuler
Liens