Image de fond changeante, choix de résolution pas assez fourni !

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Image de fond changeante, choix de résolution pas assez fourni !

Message par Bi-day le Sam 8 Déc 2012 - 9:42

Bonjour,

J'ai un problème avec le code pour fixer une image dans le fond du forum, enfin ce n'est pas vraiment un problème mais j'ai besoin de votre aide !!

Au cas ou voici l'adresse de mon forum: http://www.les-cameleons.org/

J'ai mis en place ce script sur mon forum: http://forum.forumactif.com/t286701-image-de-fond-changeante-selon-la-resolution-du-visiteur#2531683

Il se trouve que sa fonctionne bien, l'image reste bien fixe sur le fond même quand on fait défiler.

Mon problème viens du fait que l'image est découpée a l'écran en fonction de la résolution, si on tombe sur une de ces 5 résolutions pas de problème:

▪ 800x600 px,
▪ 1024x768 px,
▪ 1280x960 px,
▪ 1600x1200px,
▪ taille plus grande que 1600px de large.

J'ai crée ces 5 images, le problème c'est qu'il y a beaucoup d'autres résolutions.

J'aurais voulu savoir lesquels sont les plus utilisés pour créer les images qui vont bien et surtout comment les insérer dans ce code:

Code:
$(function(){

var bg= "Adresse image (largeur plus grande que 1600px)";

if(screen.width < 801) bg="Adresse image (largeur 800px)";
else if(screen.width < 1025) bg="Adresse image (largeur 1024px)";
else if(screen.width < 1281) bg="Adresse image (largeur 1280px)";
else if(screen.width < 1601) bg="Adresse image (largeur 1600px)";

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

});

Merci a vous et aussi à Threax pour avoir crée ce tuto !!


Dernière édition par Bi-day le Lun 10 Déc 2012 - 9:10, édité 1 fois

Bi-day
*

Messages : 32
Inscrit(e) le : 04/12/2012

http://www.les-cameleons.org
Bi-day a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image de fond changeante, choix de résolution pas assez fourni !

Message par Bi-day le Lun 10 Déc 2012 - 8:27

Un petit Up !

Bi-day
*

Messages : 32
Inscrit(e) le : 04/12/2012

http://www.les-cameleons.org
Bi-day a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image de fond changeante, choix de résolution pas assez fourni !

Message par Adam_sfp le Lun 10 Déc 2012 - 9:00

Bonjour

Vous pouvez rajouter une ligne comme celle ci en changeant avec vos valeurs
Code:
else if(screen.width < 1281) bg="Adresse image (largeur 1280px)";

Vous pouvez essayer sinon ce script à voir si cela convient.
il faut remplacer le lien de l'image dans le code par le votre

Code:
(function(a){a.backstretch=function(k,i,l){function m(c){try{g={left:0,top:0},d=e.width(),b=d/j,b>=e.height()?(h=(b-e.height())/2,f.centeredY&&a.extend(g,{top:"-"+h+"px"})):(b=e.height(),d=b*j,h=(d-e.width())/2,f.centeredX&&a.extend(g,{left:"-"+h+"px"})),a("#backstretch, #backstretch img:last").width(d).height(b).filter("img").css(g)}catch(o){}typeof c=="function"&&c()}var n={centeredX:!0,centeredY:!0,speed:0},c=a("#backstretch"),f=c.data("settings")||n;c.data("settings");var e="onorientationchange"in window?a(document):a(window),j,d,b,h,g;i&&typeof i=="object"&&a.extend(f,i);a(document).ready(function(){if(k){var b;c.length==0?c=a("<div />").attr("id","backstretch").css({left:0,top:0,position:"fixed",overflow:"hidden",zIndex:-999999,margin:0,padding:0,height:"100%",width:"100%"}):c.find("img").addClass("deleteable");b=a("<img />").css({position:"absolute",display:"none",margin:0,padding:0,border:"none",zIndex:-999999}).bind("load",function(b){var d=a(this),e;d.css({width:"auto",height:"auto"}); e=this.width||a(b.target).width();b=this.height||a(b.target).height();j=e/b;m(function(){d.fadeIn(f.speed,function(){c.find(".deleteable").remove();typeof l=="function"&&l()})})}).appendTo(c);a("body #backstretch").length==0&&a("body").append(c);c.data("settings",f);b.attr("src",k);a(window).resize(m)}});return this}})(jQuery);$.backstretch("http://img714.imageshack.us/img714/1238/1024p.jpg");

Adam_sfp
+ Hyperactif +

Masculin
Messages : 4157
Inscrit(e) le : 18/04/2008

http://antonyadam.1fr1.net/portal.htm
Adam_sfp a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image de fond changeante, choix de résolution pas assez fourni !

Message par Bi-day le Lun 10 Déc 2012 - 9:10

Merci beaucoup, votre second code est impécable et simple a mettre en place !!

Bi-day
*

Messages : 32
Inscrit(e) le : 04/12/2012

http://www.les-cameleons.org
Bi-day a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


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