Design - javascript pour le fond adaptable

Aller en bas

Design - javascript pour le fond adaptable

Message par Morrigan Caitlín Darkmoon le Lun 1 Avr 2013 - 6:26

pour que l'image de fond s'adapte aux différentes résolutions d'écran :

il faut disposer de l'image en plusieurs formats

dans le panneau d'admin, onglet "modules", tout en bas, il y a "gestion des codes javascript"
le javascript en question s'appelle "resolution", il est modifiable par l'icône jaune

voici le code actuel :
Code:
$(function(){

var bg= "http://i75.servimg.com/u/f75/16/22/83/29/192010.jpg";

if(screen.width < 1025) bg="http://i75.servimg.com/u/f75/16/22/83/29/fond1010.jpg";
else if(screen.width < 1201) bg="http://i75.servimg.com/u/f75/16/22/83/29/fond1210.jpg";
else if(screen.width < 1501) bg="http://i75.servimg.com/u/f75/16/22/83/29/fond1510.jpg";
else if(screen.width < 1901) bg="http://i75.servimg.com/u/f75/16/22/83/29/192010.jpg";

document.body.style.backgroundImage="url(\""+bg+"\")";

});

et le code expliqué :
Code:
$(function(){

var bg= "lien de l'image au format maximum (ici 1920)";

if(screen.width < 1025) bg="lien de l'image en largeur 1024";
else if(screen.width < 1201) bg="lien de l'image en largeur 1200";
else if(screen.width < 1501) bg="lien de l'image en largeur 1500";
else if(screen.width < 1901) bg="lien de l'image en largeur 1920";

document.body.style.backgroundImage="url(\""+bg+"\")";

});
avatar
Morrigan Caitlín Darkmoon
Décoratrice du sanctuaire
Décoratrice du sanctuaire

Messages : 129
Date d'inscription : 04/04/2011
Age : 52
Localisation : languedoc
Tradition : polythéisme celte

http://www.wix.com/avalondreams/morrigandarkmoon

Revenir en haut Aller en bas

Re: Design - javascript pour le fond adaptable

Message par Morrigan Caitlín Darkmoon le Lun 1 Avr 2013 - 6:34

avatar
Morrigan Caitlín Darkmoon
Décoratrice du sanctuaire
Décoratrice du sanctuaire

Messages : 129
Date d'inscription : 04/04/2011
Age : 52
Localisation : languedoc
Tradition : polythéisme celte

http://www.wix.com/avalondreams/morrigandarkmoon

Revenir en haut Aller en bas

Re: Design - javascript pour le fond adaptable

Message par Valiel le Mar 2 Avr 2013 - 8:47

Ah c'est super tout ça !!!! Je n'avais pas réussi à trouver ce sujet lol ^^'


Merci infiniment ! I love you
avatar
Valiel
Fondatrice

Messages : 542
Date d'inscription : 28/03/2011
Localisation : France
Tradition : Travaille avec les Esprits et les Dieux

http://valielsurlavoiedesdieux.wordpress.com

Revenir en haut Aller en bas

Re: Design - javascript pour le fond adaptable

Message par Contenu sponsorisé


Contenu sponsorisé


Revenir en haut Aller en bas

Revenir en haut

- Sujets similaires

 
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum