Overblog
Editer l'article Suivre ce blog Administration + Créer mon blog
16 septembre 2012 7 16 /09 /septembre /2012 09:16




 
1. Agrandir une photo au survol de la souris

Pour voir la démonstration, passer votre souris au dessus de l'image du pub irlandais en haut de cet article.



 
2. Comment agrandir une photo au survol de la souris

2.1 Enregistrer votre photo

* Enregistrer votre photo dans votre administration (ou sur un site de sauvegarde et noter son adresse URL), à un format "grand".

Inutile de dépasser les 600 pixels de large, nettement suffisant pour un article.

* Enregistrer la même photo à un format petit. Classiquement, le format vignette fait 75 x 100 pixels et noter son adresse URL.

 
2.2 Code HTML pour agrandir la photo au survol de la souris

Aller en mode HTML (en édition avancée) et ajouter le code suivant :


<img src="http://adresse image petit.jpg"
onmouseout="javascript:this.src='http://adresse image petit.jpg'
"
onmouseover="javascript:this.src='http://adresse image grand.jpg'" class="CtreTexte" />

avec l'adresse url de l'image en format "petit" aux 2 premières lignes, et l'adresse de la grande image pour "OnmouseOver".
 




 

  * 5 articles a lire pour demarrer votre blog
* Initiation au langage HTML
* Tout pour modifier et embellir vos textes
* Tout savoir sur les images 
* Des gadgets
* Votre blog ne ressemblera pas aux autres
* Mes astuces
* Référencements et indexations
* Index des articles


 

                                    Rendez-vous sur Hellocoton !                                                        

 

Partager cet article
Repost0

commentaires

C
Merci pour cette aide.<br /> Claire
Répondre
T
<br /> <br /> salut<br /> <br /> <br /> ca c'est super<br /> <br /> <br /> je vais certainement l'utiliser pour agrandir les belles photos<br /> <br /> <br /> bonne soirée<br /> <br /> <br /> <br />
Répondre
R
<br /> <br /> Slt ! Je voulais te demander comment on faisait pr enregistrer une image dans l'administration (je sais faire) mais l'enregistrer en "grand" ou en "petit" ?<br /> <br /> <br /> Je ne vois pas comment on fait.<br /> <br /> <br /> Merci bc !<br /> <br /> <br /> <br />
Répondre
A
<br /> <br /> Il faut que tu ais lap hotos en 2 exemplaires, une grande et une petite (avec un logiel photo ou dessin)<br /> <br /> <br /> <br />
N
<br /> <br /> Bon, j'ai trouvé pourquoi mes photos "tressautaient": c'est par rapport à l'endroit où s'aggrandi la photo. Il faut que la souris reste dessus.<br /> <br /> <br /> Du coup, si on a plusieurs petites photos, quand elles s'agrendissent, certaines n'ont pas la place et se décale un peu, du coup, comme la souris n'est plus sur la photo, celle-ci passe de petit<br /> à grand arrêt...<br /> <br /> <br /> Moralité: laisser de la place entre les photos (^_^)<br /> <br /> <br /> <br />
Répondre
N
<br /> <br /> Coucou Aurélie,<br /> <br /> <br /> Grâce à ton code, j'utilise presque toutes mes photos ainsi, c'est bien plus pratique: ça prend moins de place!<br /> <br /> <br /> Mais là, j'ai un soucis: quand on passe la souris sur la photo, celle-ci "tremble" <br /> <br /> <br /> J'ai essayé en tout effaçant et en remettant, mais rien à faire. Ce qui est bizarre, c'est que ça ne me le fais pas sur toutes les photos!<br /> <br /> <br /> Tu peux tester là: Books@Lot<br /> <br /> <br /> As-tu déjà eu ce problème?<br /> <br /> <br /> Bises <br /> <br /> <br /> <br />
Répondre
N
<br /> <br /> Aj, je crois savoir où je me suis trompée: c'est peut-être en enlevant le "center", j'ai peut-être enlevé un sigle de trop...<br /> <br /> <br /> Dis-moi, si je veux pas centrer ma photo, qu'est-ce que je dois enlever exactement au code?<br /> <br /> <br /> Merci <br /> <br /> <br /> <br />
Répondre
A
<br /> <br /> Difficile sans voir tout ton code. Remplace le "center" par "left", par exemple et ne touche à rien d'autre. tu as du effacer un point ou un tout petit signe...<br /> <br /> <br /> <br />
N
<br /> <br /> Recoucou! Encore moi <br /> <br /> <br /> Alors, j'ai quand même un ptit soucis (je sais, je suis embêtante ).<br /> <br /> <br /> Je mets ma photo avec le code comme tu l'indiques (sauf que j'enlève le "center" car je veux pas centrer ^^). Je valide, je vérifie et ça marche.<br /> <br /> <br /> Mais, quand je redimentionne ma photo par l'éditeur over-blog et que je la mets à la taille exact que je veux (les éditeurs ont des tailles "pré établies" et ce n'est<br /> pas forcément celles que je souhaite), je valide et là du coup, ça ne marche plus: la photo ne s'agrandit plus...<br /> <br /> <br /> Sais-tu pourquoi?<br /> <br /> <br /> Bises (^_^)<br /> <br /> <br /> <br />
Répondre
N
<br /> Je n'y manquerais pas (^_^)<br /> <br /> <br />
Répondre
N
<br /> Ca y est, maintenant ça marche: sur ta photo et sur la mienne <br /> Je sais pas pourquoi ça marchait pas hier soir <br /> Peut-être un bug d'Over-blog suite au piratage, ou simplement qu'il fallait attendre...<br /> En tout cas, un grand merci, ça fait un moment que je voulais faire ça! J'ai regardé sur le forum hier, mais rien trouvé... ici, c'est plus pratique!!<br /> Bises (^_^)<br /> <br /> <br />
Répondre
A
<br /> N'hésite pas à revenir me voir pour trouver d'autres astuces sympas pour ton blog !<br /> <br /> <br />
N
<br /> Coucouc Aurélie <br /> Quand on passe la souris sur la photo, ça ne marche pas :(<br /> Je viens de tenter avec ton code là: Books@Lot (la 1° petite vignette de livre) et<br /> malheureusement, ça ne marche pas <br /> T'as une idée pour m'aider? (^_^)<br /> Bises!<br /> <br /> <br />
Répondre
A
<br /> Hello,<br /> <br /> J'ai surtout vu que ça marche, avec ton image "Axiomatique". Sais pas si tu as trouvé le truc depuis ton message, mais aps de souci, ça fonctionne très bien. bravo a toi !<br /> <br /> <br />

Présentation

  • : Faire un blog
  • : Ce blog vous aide à vous lancer pour faire votre blog : plateforme, mise en page, décoration, gadgets...
  • Contact

Vous Cherchez Quoi ?

Bienvenue !

 

PancarteSmiliz.pngCe blog a pour objet de vous aider à faire votre blog. C'est facile, et possible sans être informaticien !

J'ai 2 autres blogs très différents, et je souhaite mettre mon expérience à votre service. N'hésitez pas à me déposer vos commentaires et questioxxns. 
Si vous débutez, commencez par l' Index des articles , rubrique "Pour bien démarrer". 

 

Inscrivez votre site sur ma Top Liste et améliorez votre référencement.  

Mon logo sur votre site

Si j'ai contribué à l'amélioration de votre blog, merci d'y mettre mon logo :
Site Faire Un Blog

Code à coller :

<a href="http://faireunblog.over-blog.com/" target="_blank"><img height="65" width="85" src="http://sd-1.archive-host.com/membres/up/42016049459753927/PancarteSmiliz.png" alt="Site Faire Un Blog" /></a>

 

 

Date du jour

 

 

 

Géolocalisation

formation