Fusionner les scripts: fonds aléatoires / adaptés à la résolution

[Invité]

Bonsoir !

J'avais installé un script pour avoir mon fond de page adapté à la résolution de l'écran, ci dessous:

Code:

$(function(){

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

if(screen.width < 801) bg="http://i71.servimg.com/u/f71/13/86/57/98/800_x_11.jpg";
else if(screen.width < 1025) bg="http://i71.servimg.com/u/f71/13/86/57/98/1025_x11.jpgg";
else if(screen.width < 1281) bg="http://i71.servimg.com/u/f71/13/86/57/98/1280_x10.jpg";
else if(screen.width < 1601) bg="http://i71.servimg.com/u/f71/13/86/57/98/1600_x12.jpg";

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

});

Et maintenant, je voudrais avoir des fonds de page aléatoire, j'ai trouvé ce script:

Code:

$(function() {

  var a = ["http://adresse_image_1", "http://adresse_image_2", "http://adresse_image_3"];

  $("#pun-logo img,#i_logo,#logo img").attr("src", a[Math.floor(Math.random() * a.length)])

});

Et donc, comment fusionner ces 2 scripts pour avoir des fonds de pages aléatoires qui s'adaptent a l'écran?

Merci de m'avoir lu.

[Invité]

Up ? J'y connais pas grand choses, il faut peut être le faire en escalier, un script dans un script. Ou alors le premier ( fond de page aléatoire ) rappelle le deuxième dans son fonctionnement ( fond de page qui s’adapte à l'écran ).

Je profite de ce Up pour renvoyer à un autre topic:
https://forum.forumactif.com/t348656-musique-d-un-module-youtube-qui-change-a-l-actualisation

[Invité]

Zog zog ! ( up )

[Adam_sfp]

Bonjour

peut être ceci
http://srobbin.com/jquery-plugins/backstretch/

Regardez la démo Using Backstretch as a slideshow..

Cordialement.

[Invité]

Ce n'était pas un diaporama, mais simplement un changement d'images lorsque l'on change de page que je voulais.

Ils sont déjà proposés sur se site, tout comme les images qui s’adaptent à l'écran ( voir les codes au premier post ). Je voulais juste fusionner les 2 scripts en faite.

[Ea]

Bonjour,


On pourrait faire comme ceci :

Code:

$(function() {

  var b= [
    800, ['image800px_1','image800px_2','image800px_3'],
    1024, ['image1024px_1','image1024px_2','image1024px_3'],
    1280, ['image1280px_1','image1280px_2','image1280px_3'],
    Infinity, ['image1600px_1','image1600px_2','image1600px_3']
  ];

  for(var a = 0; a < b.length; a++) {
    if(screen.width <= b[a++]) {
      return document.body.style.backgroundImage = "url(" + b[a][Math.floor(Math.random() * b[a].length)] + ")"
    }
  }
});

Une image choisie aléatoirement du tableau de la ligne avec le 800 sera mise pour les écrans avec une résolution de 0 à 800 pixels en largeur.

Pareillement pour la ligne avec le :

• 1024, mais pour une résolution de 801 à 1024.
  
  
• 1280, mais pour une résolution de 1025 à 1280.
  
  
• Infinity, mais pour une résolution de 1281 à l'infini.

Cordialement.

[Invité]

Ça fonctionne parfaitement, encore merci Ea !