effet gif |
Répondre | Page 12> |
Auteur |
Sujet Recherche Options des sujets
|
nico38
Senior Member Depuis le: 18 Jan 2014 Status: Inactif Points: 3967 |
Options des messages
Thanks(0)
Envoyé : 30 Jan 2016 à 16:12 |
Bonjour,
j'ai une image et je veux faire un effet "gif" : - l'image 1 disparait - puis 3 secondes plus tard une deuxieme image réapparait en fondu et le tout se répète en boucle Je ne peux superposer 2 image il faut que je change le src de l'image. Est-il possible de faire appararaître en boucle, alternativement, en fondu, deux src en modifiant uniquement le src de l'image en question ? Pour imager c'est dans ce style : $(function() { $('img').fondu().attr('src', '2.png'); /*changer src*/ }, 3 secondes); $(function() { $('.img').fondu().attr('src', '1.png'); /*rechanger src*/ }, 3 secondes); }); $répéter en boucle Edité par nico38 - 30 Jan 2016 à 16:12 |
|
Un lien vers ton site tu enverras | Problème d'affichage ? ---> CTRL+F5 | Couleur des liens --> "Styles des liens"
|
|
Hobby001
Admin Group Modérateur Depuis le: 14 Feb 2015 Pays: Canada, Québec Status: Inactif Points: 6507 |
Options des messages
Thanks(0)
|
Un peu comme un skitter slider?
|
|
nico38
Senior Member Depuis le: 18 Jan 2014 Status: Inactif Points: 3967 |
Options des messages
Thanks(0)
|
<img src="image1.png">
qui devient par jq : <img src="image2.png"> puis re : <img src="image1.png"> le tout en boucle et fondu a chaque changement d'image (c'est fait sur notepad pas sur oe) Edité par nico38 - 30 Jan 2016 à 17:41 |
|
Un lien vers ton site tu enverras | Problème d'affichage ? ---> CTRL+F5 | Couleur des liens --> "Styles des liens"
|
|
Hobby001
Admin Group Modérateur Depuis le: 14 Feb 2015 Pays: Canada, Québec Status: Inactif Points: 6507 |
Options des messages
Thanks(0)
|
Faudrait le faire avec un setTimeout(fonction,3000) dans un while j'imagine
Edité par Hobby001 - 30 Jan 2016 à 17:48 |
|
nico38
Senior Member Depuis le: 18 Jan 2014 Status: Inactif Points: 3967 |
Options des messages
Thanks(0)
|
oui j'ai essayé de coder avec setTimeout, setInterval etc... mais sans effet
je vais fouiller edit : par exemple dans l'idée (mais il manque un "fondu" entre le changement de src) function boucle() { setTimeout(function() { $('.img-head img').attr('src', '2.png'); }, 1000); setTimeout(function() { $('.img-head img').attr('src', '1.png'); }, 2000); }; setInterval(boucle, 3000); mais il faut un fondu (c'est surtout là où je me pose la question) et une boucle Edité par nico38 - 30 Jan 2016 à 20:58 |
|
Un lien vers ton site tu enverras | Problème d'affichage ? ---> CTRL+F5 | Couleur des liens --> "Styles des liens"
|
|
Hobby001
Admin Group Modérateur Depuis le: 14 Feb 2015 Pays: Canada, Québec Status: Inactif Points: 6507 |
Options des messages
Thanks(0)
|
J'ai utilisé setTimeout dans le tuto pour opencart dans OE. La syntaxe y est bonne sinon je regarderai ça demain
Edité par Hobby001 - 30 Jan 2016 à 22:14 |
|
nico38
Senior Member Depuis le: 18 Jan 2014 Status: Inactif Points: 3967 |
Options des messages
Thanks(0)
|
ce que j'ai mis :
function boucle() { setTimeout(function() { $('.img-head img').attr('src', '2.png'); }, 1000); setTimeout(function() { $('.img-head img').attr('src', '1.png'); }, 2000); }; setInterval(boucle, 3000); ça fonctionne, mais c'est la transition fondu d'un changement de src qui pose surtout probleme, je vois pas comment faire . |
|
Un lien vers ton site tu enverras | Problème d'affichage ? ---> CTRL+F5 | Couleur des liens --> "Styles des liens"
|
|
Hobby001
Admin Group Modérateur Depuis le: 14 Feb 2015 Pays: Canada, Québec Status: Inactif Points: 6507 |
Options des messages
Thanks(0)
|
Hobby001
Admin Group Modérateur Depuis le: 14 Feb 2015 Pays: Canada, Québec Status: Inactif Points: 6507 |
Options des messages
Thanks(1)
|
Vous pouvez essayer:
css js
Vous pouvez paramétrer ce qui vous tente comme délais |
|
Dmit OE
Admin Group Depuis le: 31 Mai 2012 Status: Inactif Points: 13971 |
Options des messages
Thanks(1)
|
Voici le code qui je viens de tester. Pour ne pas m'embeter avec les liens vers les images, j'ai ajoute (pas par-dessus, juste a cote) un element-image supplementaire avec l'image alternative et mis le class img-alt dessus.
|
|
Répondre | Page 12> |
Tweet
|
Aller au Forum | Permissions du forum Vous ne pouvez pas écrire un nouveau Sujet Vous ne pouvez pas répondre aux Sujets Vous ne pouvez pas effacer vos messages Vous ne pouvez pas éditer vos messages Vous ne pouvez pas créer des sondages Vous ne pouvez pas voter dans les sondages |