Je voudrais une image aléatoire à chaque changement de page de manière aléatoire

[Morph]

Bonjour,

J’aimerais proposer à mes membres de changer l'image de fond de manière aléatoire suivant 6/7 images (voir plus) en fonction de leur navigation ou chargement du forum.

Exemple : je me connecte, j'ai une image N°1, puis je clique sur portail par exemple et la l'image de fond est l'image N°5, je reclic sur forum et là j'ai l'image de fond N°2.

Questions, est ce possible, si oui, que dois je faire?
dois je également supprimer l'image de fond que j’ai inscrit dans les paramètre avancé ? et est ce un code CSS, que je ne maîtrise pas.

Merci de votre aide.

[◦Jay◦]

Bonjour Morph, vous avez la réponse ici.

Bien à vous.

[Morph]

Merci,
mais ça c'est pour une bannière si je ne m'abuse.
Par contre moi c'est le fond de mon forum, qu je veux avoir en image de fond aléatoire.

Est ce bien la même chose ?

Merci.

[Morph]

J'ai essayé, et j'ai donc taper ceci :





Mais ca ne marche pas.

Ai-je bien réaliser la manip?

merci de votre aide.

[◦Jay◦]

Ah oui, cela ne va pas dans le CSS, dans votre P.A.>Modules>HTML & JAVASCRIPT>Gestion des codes Javascript>Activer la gestion des codes Javascript :Cochez "oui" puis cliquez sur créer un nouveau javascript, collez le code proposé en insérant vos images, cochez sur toutes les pages puis validez.

Bien cordialement.

[Morph]

Merci,

Je crois avoir compris et donc, j'ai écris ca :



Mais ça ne fonctionne toujours pas!
Fond blanc!

Ou est ce que je me trompe.

merci beaucoup de votre soutient!.

[Morph]

Ah si c'est bon super!

Merci Beaucoup !

Très reactif!

[◦Jay◦]

Bonne soirée.

[Morph]

question comment puis je forcer la taille de l'image à 2200 par 1238 ?
merci encore

est cele bon code ?

$(function() {
var a = ["http://Breizheric.pagesperso-orange.fr/map/fond1.jpg", "http://Breizheric.pagesperso-orange.fr/map/fond2.jpg", "http://Breizheric.pagesperso-orange.fr/map/fond3.jpg", "http://Breizheric.pagesperso-orange.fr/map/fond4.jpg", "http://Breizheric.pagesperso-orange.fr/map/fond5.jpg", "http://Breizheric.pagesperso-orange.fr/map/fond6.jpg", "http://Breizheric.pagesperso-orange.fr/map/fond7.jpg", "http://Breizheric.pagesperso-orange.fr/map/fond8.jpg", "http://Breizheric.pagesperso-orange.fr/map/fond9.jpg", "http://Breizheric.pagesperso-orange.fr/map/fond10.jpg", "http://Breizheric.pagesperso-orange.fr/map/fond11.jpg", "http://Breizheric.pagesperso-orange.fr/map/fond12.jpg", "http://Breizheric.pagesperso-orange.fr/map/fond13.jpg", "http://Breizheric.pagesperso-orange.fr/map/fond14.jpg", "http://Breizheric.pagesperso-orange.fr/map/fond15.jpg"];
width:2200px;
height:1238px;
$("body").css("background-image", "url("+a[Math.floor(Math.random() * a.length)]+")")
});

[Morph]

au pire je redimensionne les image à 2200px

[◦Jay◦]

Il serait préférable d'adapter les images toutes à la même taille et plutôt en 4/3 pour que chaque utilisateur ait un joli fond puis mettez ce code dans votre CSS, ceci permettra a l'image de s'adapter à chaque résolution d'utilisateur :

Code:

body {
  background-size: 100% auto;
  background-repeat:no-repeat;
}

Bien à vous.

[Morph]

super!