11544 sujets

JavaScript, DOM et API Web HTML5

Bonjour a tous,

j'aimerais faire quelque chose de très simple (je pense)

j'ai crée un site web, et l'image de fond du site est actuellement un GIF composé de 2 images (qui donne un effet clignotant : image ici : http://sunset.22web.net/images/body-bg.gif )

Je pense qu'en js on peut arriver a la meme chose, mais avec 2 images JPG si possible car la taille du GIF animé est beaucoup trop importante et l'image met longtemps a se charger sur des petites connexions...

Une idée très simple pour obtenir le meme effet?

Ps : chaque image dure 1 seconde, et elles se nommeront bg1.jpg , et bg2.jpg .

Merci d'avance a vous!
Modifié par skymike03 (11 Oct 2011 - 15:41)
Hello,

Tu peux changer la valeur de la propriété background-image de l'élément BODY (ou autre élément) en JavaScript. Je te laisse chercher de quelle manière et tester ça un peu, c'est pas bien compliqué.

Ensuite, il s'agit de faire ce changement en boucle et toutes les secondes. Pour ça il faut voir du côté de window.setTimeOut et écrire une fonction qui fait quelque chose (changer le background-image) puis s'appelle elle-même avec un setTimeOut.
Bonjour, merci de ta réponse.

Malheuresement ca fait une semaine que je cherche quelque chose de simple et sans réponses .. Je débute en création de site web, et je ne connais pas du tout le javascript..

les seules réponses que je trouve sont des changement d'image au click, ou au passage de la souris..

Si tu ne veux pas me donner la solution, pourrait tu m'aiguiller vers un lien de forum, ou vers un autre site car la j'ai fait toutes les pages de google avec des tas de recherches différentes depuis 1 semaine et j'en suis toujours au meme point... donc j'ai fini par reduire la taille de mon gif et le faire repeter en x mais ce n'est qu'une solution provisoire..





merci d'avance.
Salut,

Une mise en garde, toutefois : le « clignotement » de ton arrière-plan peut très vite agacer bon nombre de tes utilisateurs, qui au mieux seront déconcentrés au pire feront des crises d'épilepsie (si tu es fan de jeux vidéos, tu auras remarqué la présence d'une étiquette rouge d'avertissement à ce sujet : ce n'est pas pour rien Smiley cligne ).
Mon site est le suivant : www.sunset.new.fr (nom de domaine et hébergement gratuit pour le moment car site de démo..)

C'est un site pour une discothèque de ma région, donc les gens épileptiques ne vont pas forcément en discothèque.. Smiley cligne . Et personne ne m'a dit que le fond du site génait ni déconcentrait...
oui c'est sur mais bon , pour un site de discothèque ca fait pas de mal un peu d'animation, enfin bref... la question n'était pas la à la base donc merci de ne pas trop faire de hors sujet. Smiley smile
Tu as la chance d'avoir des avis de personnes expérimentées, plutôt que de parler de hors-sujet, prends en compte les conseils.

Bref, c'est clair que ça énerve, le fait qu'il n'y est pas de transitions ... C'est horrible même.
Certaines règles ergonomiques régissent le monde Smiley smile

Aussi attention, tu ne passes que par des frames sur ta page, le référencement va en prendre un coup.
vincentD83 a écrit :
Tu as la chance d'avoir des avis de personnes expérimentées...

...tu ne passes que par des frames sur ta page


Pour des personnes expérimentées, vous pourriez vous rendre compte que les frames ce n'est pas moi qui les ait crées mais la redirection new.fr (je dis vous car beaucoup de personnes "expérimentées" m'ont sorti la meme chose) ... Je suppose que tu as vu ca dans le code source, tu aurais du remarqué qu'il y a le lien du site d'origine, et c'est la source de ce lien qu'il faudrais regarder, et non celle du domaine new.fr ...


Je suis peut etre débutant en création de site web au niveau pratique et fignolage, mais j'ai quand même appris les bases avant de me lancer...


Ensuite peut etre que ca fait "horrible" un fond qui clignote mais pour le moment ce n'est pas le soucis, je cherche juste a optimiser la taille de l'image pour améliorer le temps de chargement de la page...

j'ai bien précisé que mon site etait un site de démo pour le moment, donc sur hébergeur et redirection gratuites, donc le référencement, pas besoin je partage juste a mes proches pour avoir leur avis sur le style visuel .

Donc si tu as une solution a proposer pour mon problème; je t'ecoute attentivement.
Salut tout le monde car cela fait bien longtemps que je ne suis pas venu sur le forum...

Cher Smyke...

Ton site, plus précisément ton body semble fixé à 1024 px de large...

Pour t'orienter vu que tu semble maitriser les divs...

Un js qui gère le visibility de deux div l'un sur l'autre avec les deux images et tout cela en fond avec un z-index à 0 me semble une solution simple...
tu pourrais même mettre des png qui travaillent sur la transparence et pourrait conserver un background noir unicolor...

regardes du côté de jquery ou des fonctions native du js... ça n'a rien de bien compliqué....