Overblog Suivre ce blog
Editer l'article Administration Créer mon blog
27 mai 2013 1 27 /05 /mai /2013 16:44





 
1. Mettre une image gif volante


Maintenant que vous connaissez la balise "marquee" - Sinon, pour la révision c'est ici Le défilement avec la balise Marquee  - je vous propose de l'utiliser pour y mettre une image volante dans un article, ou un module.


2. Choisir l'image qui va voler

Vous devez d'abord choisir l'image que vous voulez utiliser, puis noter son adresse.

Il est plus logique de choisir une image que l'on s'attend à voir voler, comme un insecte ou ce très joli papillon, mais si vous voulez un effet décalé qui surprendra vos visiteurs, vous pouvez au contraire choisir tout autre chose.


3. Faire voler son image

3.1 Code HTML à insérer dans l'article ou le module


<marquee behavior="alternate" direction="up" width="80%"><marquee direction="right" style="width: 650px; height: 88px;" behavior="alternate"><img src="url votre image"></marquee></marquee>

et vous remplacez "url de votre image par l'adresse de votre image.


3.2 Le paramétrage

width est la largeur de déplacement occupée par le déplacement de votre image. 80% correspond à 80% de la largeur de l'article ou du module où vous le mettez. Si vous voulez qu'il couvre tout, mettre 100 %.

Vous réglez à la fois le déplacement en largeur (le width dans la balise avec le behavior right) et en hauteur (le height)


3.3 Ajustements

Si vous cliquez juste à côté de votre objet volant (en mode édition), vous voyez apparaître un rectangle symbolisé par 6 petites marques : aux angles et au milieu de la longueur.
Ce rectangle correspond à la surface de déplament de votre objet. Vous pouvez la régler en déplaçant ces pettis marques.


3.4 Le code complet du papillon qui vole

<marquee width="90%" behavior="alternate" direction="up" style="width: 100%; height: 100px;"><marquee behavior="alternate" direction="right" style="width: 651px; height: 88px;"><img height="60" width="80" src="http://www.gif-anime.org/im/gif/animal/papillon/papillon8.gif" class="CtreTexte" /></marquee></marquee>









 

  * 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

Repost 0
Published by Aurelie - dans Les images
commenter cet article

commentaires

maeldune 22/12/2010 13:20



Même si je ne laisse pas souvent des messages.....


je suis les articles du blog, toujours intéressants....merci!


et passe souhaiter d'excellentes fêtes de fin d'année,


ainsi que longue vie au blog....



Aurelie 22/12/2010 16:40



Merci à toi de ta fidélité ! Bonnes fetes



JOELLE 28/08/2010 19:12



Bonsoir


Le papillon qui vole partout ça fonctionne MAIS il volète avec son petit carré blanc sur mon fond bleu/vert et c'est pas top! Comment fait-on pour gommer le tour blanc du papillon ????



Aurelie 29/08/2010 18:23



Il faut alors retoucher l'image pour lui apporter un fond transparent. Tu peux faire ça ici : http://reduction-image.com/gif-anime/index.php



Fantaisie 08/04/2010 14:20



Bonne journée



Dany 08/04/2010 11:13



j'aime bien cette astuce,on peut faire de belles choses, mais faire attention, quand l'objet arrive au bord de l'écran il tombe sur le clavier ;=)) hihi, bon d'accord j'arrête la moquette!
$$$,bonne journée



Bérengère KLIBER 08/04/2010 10:52



petit coucou du j€udi


bi$$$ amical€€€



Krio 08/04/2010 09:46



un passage pour te dire bonjour ! et un clic $$



ema2100 , et son Site/Blog sur l'actu.music,web,.. 08/04/2010 09:44



Salut,


Merci pour la réponse


Bonne journée.


ema2100



itachi 08/04/2010 09:21



hello!!


passage du jeudi, pluvieux chez nous!


bonne journé€


bi$e$!


 



Cec 07/04/2010 19:36



bonne soirée



Bidouillette/Tibilisfil 07/04/2010 18:56



Petite souris ordi, j'adore aussi, çà change ici! Cà va faire lourd si ej mets tout sur mon blog, mais j'apprécie !!!! Clicou et bonne soirée!!!!



Présentation

  • : Faire un blog
  • 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