[JS] Background fade in and out [Résolu/Fermé]

Messages postés
357
Date d'inscription
dimanche 9 juillet 2006
Statut
Membre
Dernière intervention
13 octobre 2014
- - Dernière réponse : niconovice
Messages postés
974
Date d'inscription
lundi 10 novembre 2008
Statut
Membre
Dernière intervention
3 mars 2014
- 14 sept. 2010 à 18:10
Bonjour,

Bon comme je suis une m**** en javascript je viens demander votre aide. J'ai une page avec plusieurs boutons, et j'aimerai que lorsque je clique sur un bouton le background de la page change mais avec un petit effet de fade in & out, le tout en javascript. J'ai réussi sans problème à faire changer le background, mais par contre pour l'effet de fade in & out, je n'ai pas réussi :S
Donc voilà est ce que vous pourriez me guider, voir même me donner un bout de code si vous en avez un?
Merci d'avance :)



--
Afficher la suite 

4 réponses

Messages postés
357
Date d'inscription
dimanche 9 juillet 2006
Statut
Membre
Dernière intervention
13 octobre 2014
62
0
Merci
up... :)
Messages postés
357
Date d'inscription
dimanche 9 juillet 2006
Statut
Membre
Dernière intervention
13 octobre 2014
62
0
Merci
Up.....
Messages postés
357
Date d'inscription
dimanche 9 juillet 2006
Statut
Membre
Dernière intervention
13 octobre 2014
62
0
Merci
Up..
Messages postés
974
Date d'inscription
lundi 10 novembre 2008
Statut
Membre
Dernière intervention
3 mars 2014
71
0
Merci
faut allez faire un tour du cité de chez jquery il te réglera ça vite fait bien fait :)

grafikart l'explique très bien dans l'un de ses tutos, va voir sur son site
kelsett
Messages postés
357
Date d'inscription
dimanche 9 juillet 2006
Statut
Membre
Dernière intervention
13 octobre 2014
62 -
Ok, très intérressant le blog de grafikart, par contre ya rien de plus léger? je me doutais bien qu'on pouvait réaliser ca avec la librairie jquery, mais ca rajoute quelques dizaines de Ko sur le site quand même ... x)
niconovice
Messages postés
974
Date d'inscription
lundi 10 novembre 2008
Statut
Membre
Dernière intervention
3 mars 2014
71 -
La plupart des connexions sont de plusieurs méga, ne t'en fait pas pour 70Ko de script, Jquery sera ton meilleur atout pour ce que tu veux faire, il te suffira de quelques lignes de codes pour y parvenir.
c'est parfait pour les personnes comme toi et moi qui sommes pas très fort en JS ^^

Un exemple pour faire ce que tu veux faire:
<script>
        $("a").click(function () {
          $("div").fadeIn(3000, function () {
            $("span").fadeIn(100);
          });
          return false;
        }); 

      </script>


juste ça et hop un petit fadeIn sur ta div :))

le 3000 et le 100 sont des commandes de vitesse, tu pourras comme ça choisir la vitesse de ton effet ! Un truc vraiment accessible pour un debutant pour des effets pro ;)

Jquery power !!! =D

Voilà une page des fonctions qui devrait t'intéresser et n'hésite pas à retourner sur le l'excellent blog de grafikart pour mieux comprendre Jquery et pas mal d'autre trucs d'ailleurs ^^

http://api.jquery.com/category/effects/

@+
kelsett
Messages postés
357
Date d'inscription
dimanche 9 juillet 2006
Statut
Membre
Dernière intervention
13 octobre 2014
62 -
Pour les 70Ko, c'est question de perfectionnisme, je fais toujours en sorte que mon site soit le plus rapide possible en économisant des lignes de codes, en compressant le tout etc.

Merci pour ton exemple, et donc pour changer le background du site il suffit que je remplace "div" par "body"? Merci
niconovice
Messages postés
974
Date d'inscription
lundi 10 novembre 2008
Statut
Membre
Dernière intervention
3 mars 2014
71 -
Salut,

l'ami grafikart t'expliquera bien mieux moi :)

http://www.grafikart.fr/tutoriels/initiation-jquery-84

@+