Zoom en survolant une image de page Web et diaporama

[Tom]

Bonjour,

Je vous fait partager une rencontre sympa sur la toile :
- Comment zoomer une image dans une page html
- des boutons animés au passage de la souris
Des exercices courts et assez simple à mettre en oeuvre dans une feuille de style CSS.

http://mammouthland.free.fr/cours/css/cours8.php

Pour voir quelques exemples j'en ai placés trois dans la deuxième partie de ma page d'accueil, et ils fonctionnent aussi bien avec IE qu'avec Mozilla :

http://jptom.free.fr/

[Tom]

Encore un petit bijou d'animation de page web.

Un petit javascript à insérer dans la page html et en passant la souris au dessus d'une image, la visionneuse se met en marche.
Elle s'arrête dès que l'on retire la souris de l'image.

Consultation du script complet :
http://www.jejavascript.net/rollov_3bis.php

Consultation de deux exemples :
http://jptom.free.fr/GaleriePublique/NavPub.html

Le code a été simplifié et adapté à la possibilité d'intégrer plusieurs visionneuses dans la même page.

Pour voir le code :
- sous IE : menu Affichage/Source
- sous Mozilla : menu Affichage/Code source de la page

[John Lee]

Pour le zoom, si tu parles des trois photos du bas (les deux bebes et la page) ca ne marche pas sous firefox (mais je crois que c'est un pur rejet firefox, j'avais fait un essais une foi et je ne l'avais pas garder a cause de ce probleme)

Pour la petite visionneuse, evidement, pas de probleme sous firefox

[Tom]

Bonjour John,

Merci pour le test.
J'ai reformulé mon message car ce ne sont pas les dernières du bas, mais une carte avec Blair, les roses trémières et la carte avec Marilyn.
Mais de toute façons si ça ne marche pas avec ton Firefox, tu n'as donc pas pu les voir. Pourtant sur le site donné en lien pour le CSS, Firefox fait partie des navigateurs compatibles.

Fonctionne avec :

* FireFox
* NS 6/7
* Mozilla 1.x
* MSIE 6+
* Opéra 7
* Safari

Je suppose que tu as désactivé le verrouillage des popups pour tester ?
Sur une de mes bécanes, j'ai eu un blocage sur les petites visionneuses avec IE, car la protection des popups était activée.

[John Lee]

si c'est les cartes tony blair, rose and miss marilyn,je viens de refaire un essais sous firefox pas de probleme, j'ais bien en effet zoom sur la rose, pour marilyn je la vois de dos (ca me rapelle une pub demain j'enleve le bas) et pour mister blair , je le vois bien en fetard

[John Lee]

pas de probleme avec firefox et mozilla sous linux

La vie est donc belle

[Tom]

Oui John,

Merci pour les tests.
Moralité avec un peu de javascript et de css (en copier coller, rien de bien sorcier) on arrive à obtenir de effets plutôt sympas.

J'aime bien aussi cet effet de curseur :

http://www.editeurjavascript.com/script ... s_1_66.php

[John Lee]

l'effet est sympathique, mais je me demande si au bout d'un moment ca ne fatigue pas le visiteur ?
(je suis linux et firefox et il marche, c'est deja ca). J'avais fait un essais au debut avec une horloge qui suivait le curseur, tres rapidement je l'ais vire, ca donner un leger mal de mer

Le javascript c'est vraiment sympa et ca permet de faire pas mal d'effet qui donne vie a une page

[Coraliecaramel]

Merci Tom,
J'essaierai aussi.

[John Lee]

puisqu'on en est au effet javascript, un systeme que j'aime bien, c'est la gestion des onglets en Javascript

Par exemple dans ma page liens, je ne voulais qu'une page, mais differencier mes liens NYC, Photofiltre et mes bannieres

Voir ici :
http://perrin.olivier.free.fr/partenaire/index.html

Ca marche sous firefox et Ie (sous linux et windows)

J'ais trouve la base ic : i
http://www.javascriptfr.com/code.aspx?ID=16288

[Tom]

Oui John,

Sympa la gestion des onglets, je vais creuser un peu et voir si je peux intégrer ça sans tout casser.
A propos, merci d'avoir inscrit mon site dans tes liens, avec copie d'écran c'est assez parlant.
D'accord avec toi pour le curseur, d'autant qu'il faudrait modifier quelques réglage pour le ramener plus facilement en mode normal par le double click.
C'était juste pour le fun.
Autre découverte aménagée au cours de la journée en javascript : un diaporama paramétrable en durée d'intervalle. Consultable à partir de cette page :

http://jptom.free.fr/GaleriePublique/NavPub.html

Si j'ai un peu de temps dans les jours à venir, je regarderai si je peux l'intégrer dans un frameset avec un index pour pointer sur la bonne image avant le lancement du diaporama.
A+

[John Lee]

Le diaporama programmable c'est pas mal, il rend bien
J'attends avec impatience de voir ce que cela va donner en final

[Tom]

Merci John,

Je viens d'y rajouter un compteur de vues.
Il n'est pas dit que je pourrai passer un paramètre d'un cadre à l'autre. Je débarque complétement dans le javascript. Mais petit à petit ...

[John Lee]

Merci John,

Je viens d'y rajouter un compteur de vues.
Il n'est pas dit que je pourrai passer un paramètre d'un cadre à l'autre. Je débarque complétement dans le javascript. Mais petit à petit ...

d'apres moi, pour ca il faudra que tu passes par un coockies, j'ais regarde c'est comme ca que marche une bonne partie des diaporamas de Jalbum, sauf si tu fais un diaporama avec une seule fenetre

pour l'utilisation des coockies, je te conseille ce lien
http://www.actulab.com/les-cookies-en-javascript.php

Il explique tout et donne des exemples d'une simplicitees

Je debute aussi et si on peut s'aider, ce sera avec plaisir

[Tom]

Impeccable,

Merci pour le lien, je vais continuer à creuser.