Résolu IMAGE TOMBANTES SUR MA PAGE

BONJOUR JE VOUDRAIS METTRE SUR MA  PAGE UN GIF QUI DESCENDRAIS SUR TOUTE LA PAGE JE NE SAIS PAS OU ET COMMENT METTRE LE CODE  J'HEBERGE SUR ARCHIVE HOST QUEL CODE FAUT METTRE MERCI PAR AVANCE

Bonsoir,

Une idée de code  (sans JavaScript):

== CSS ==
<style><!--
/* pour image en mouvement */
#mouvimage {
 position: absolute;
 left:250px;   /* distance du bord gauche de l'écran ou du blog selon css existant */
 animation: hautbas 20s infinite;    /* nom choisi | durée descente 20s | illimité */
 animation-timing-function: linear;  /* mouvement régulier */

}
@keyframes hautbas {
  from {top:0px;}
  to {top: 100%;}  /* possible me mettre une valeur en px */
}
--></style>

== HTML ==
<div id="mouvimage"><img src="adresse image" alt=" " /></div>

L'éditeur actuel n'accepte pas ce type de css. Le plus simple est donc de mettre l'ensemble du code dans la source < > d'un module (agira avec toutes les page) ou celle d'un article (n'agira que si cet article est affiché)

  C'est le même principe d'animation que pour le défilement horizontal par CSS proposé dans ce sujet.

bonjour j'ai bien mis le code

<p><img src="http://ekladata.com/6d5wSjEwwqW4wRmBF9b9oR2jFrw/mouetteoblique-1.gif" alt="" />/div&gt;</p>

dans mon module simple l'image apparait sur la gauche dans le menu mais pas sur ma page principal et tombante comme le le voudrais

J'ai fais un copier coller dans le css mais il dit qu'il manque quelque chose

je suis bete pas possible(76ans)je vous remercie de votre aide CordialementLUCILYNE

Bonjour,

Ton image est de taille 650 par 600px, c'est elle qui descend, mais dans ton image le petit volatil descend déjà en biais puis remonte de 500px environ avant de redescendre.

Le mouvement de l'image et celui de l'oiseau sont indépendants et n'ont pas, ni la même trajectoire, ni la même vitesse. Visuellement ça doit ressembler, j'imagine, à une vision après un apéro très alcoolisé.

Essaye de nouveau avec cette image : (c'est ton avatar avec une taille réduite à 50px)
http://ekladata.com/xhFeEYwvCJfhmp55RI9_q9KKveI@50x50.jpg

Ça devrait être déjà mieux.

Bon essai

la vieille casse pieds est de retour je viens de faire une nouvelle image gif que j'ai mis dans le module simple de gauche donc voilà

<div id="mouvimage"><img src="http://ekladata.com/vpTv8FI65F5HYmqs_gc17HvY3Fk/mouette-gif.gif" alt="" /></div> ma petite mouette  (50px 33px) vole bien sur la gauche dans le menu mais pas sur ma page

A l'instant ou j'écris ce commentaire je ne vois pas sur ton blog : ni le code dans un module, ni l'oiseau qui vole.

Je t'ai indiqué un code css qui par défaut fait descendre l'image à 250px du bord gauche,  avec 20s de temps pour faire une descente  (il fallait bien que je mette des valeurs sinon rien ne fonctionnerait).

Ton menu de gauche fait 350px de large, donc si l'image descend dans ce menu c'est que le code fonctionne parfaitement ! 

A toi de modifier les valeurs pour que la descente s'effectue selon tes préférences  (dans la page, au centre, ou plutôt à gauche ou plutôt à droite, au 1/4 ...  En 10 secondes, en 30s, en 17s etc...)

Bon choix   

oui effivement  j'ai un autre eklablog ou je fais tout mes essaie La je l'ai mis sur mon blog ,on vois bien la mouette sur le coté  Mais quand je fais copie coller que j'ai suivie tes instructions dans le css il me dise (Le code CSS comporte une erreur, merci de le corriger avant d'enregistrer) par contre je ne sais pas si il faut que je mets (

<img src=" http://ekladata.com/1FBZCEhlIyiSBJS655foOPoBtkI/79874669-o.gif "   ET SI OUI Où? JE PEU SI TU ME DONNE TON SPEUDO TE DONNER L'AUTORISATION comme sa je verrais comment tu as fais Je suis perdue merci bonne Paques amitié lucilyne

C'est que tu n'as pas bien noté "les instructions" qui accompagnent le code ! 

J'ai indiqué : L'éditeur actuel n'accepte pas ce type de css.

Il n'y a pas d'erreur, il y a simplement une propriété css dont l'usage n'est pas prévu par cet outil (animation).

Pour ton usage, le plus simple est donc de mettre l'ensemble du code dans la source < > d'un module (ou d'une page/article si besoin que sur cette page précise).

Pour info : ce css peut aussi être placé ailleurs avec des modalités  différentes (fichier médiathèque et/ou zone de script)

Si tu veux autoriser quelqu'un à intervenir sur ton blog c'est à toi de donner une permission au pseudo de ce quelqu'un.  Le mien c'est stormalo

Je pense sincèrement que tu peux y arriver seule. Hier 16 avril tu avais bien mis le code comme il fallait. C'est seulement le choix de l'image et le réglage de l'animation qui étaient à modifier.
Maintenant que l'image convient il suffit d'ajuster le défilement : valeur de la position left à augmenter (voir aussi, éventuellement, ajuster le temps d'une descente).

Bonne suite de ce week-end de Pâques.

bonjour Stormalo je crois que je suis en bonne voie! sur mon blog essaie sa a marcher sauf que la mouette ne se repartie pas sur toute la page ?Peu tu me dire si je peu faire pareille

avec mes annimations en htlm 5 a la place des gifs ?je te remercie

Bonne fin de week-end amitié lucilyne

Je ne sais pas ce que tu as fait, mais actuellement tu n'as pas la partie css qui est copiée-collée dans la source < > du module ; donc ce soir la mouette fait du sur place.
Il est donc impossible de comprendre ce que tu veux dire avec "sauf que la mouette ne se repartie pas sur toute la page"

Les animations n'ont rien à voir avec le html, mais du css (HTML concerne le contenu. Le style, la déco, les effets, c'est des règles en CSS).

Le .gif est un format de codification des images (comme .jpeg  .png   .tiff  .raw etc.) Chaque principe de format d'image a ses particularités.

Le .gif n'est pas fait pour réaliser des vraies animations (ces "animations" gif sont en réalité une répétition de quelques images qui provoquent une illusion de mouvements,  plus ou moins saccadés)

Bonne soirée.