La date/heure actuelle est Ven 29 Mar 2024 - 1:10

1 résultat trouvé pour phpbb

Bannière de fond de page aléatoire (phpBB3)

La balise div ayant pour id "wrap" entoure tout le contenu du Forum, en soit sur votre forum elle ne sert pas à grand chose, dans votre CSS le seul truc utile est "border: 0 solid #FFF;" qui devrait être écrit "border: 0" pour retirer la bordure blanche de base de cette div Wink

Pour la bannière aléatoire, on va donc suivre ce tuto et reprendre le code de celui-ci en le modifiant légèrement pour que tu es l'effet désiré :

https://forum.forumactif.com/t223082-banniere-aleatoire-ou-defilante

Le code de base modifie la bannière du forum et donc change le header, dans notre cas c'est le fond de page qu'on va changer, du coup, on va modifier un peu le code en remplaçant la cible par "body" pour optimiser encore plus on va pouvoir mettre "#phpbb" qui va cibler uniquement le body de cette page, et ne touchera donc pas à celui de la Chatbox par exemple. Ensuite, on va lui demander de changer la propriété css "background-image" pour y ajouter l'image qu'on veut à chaque fois. Tu pourras d'ailleurs retirer l'image de base de fond de page que tu as mis dans tes images dans le panneau d'administration, elle sera généré par le code. Il va nous falloir aussi rajouter plusieurs images, mais ça, ce n'est pas bien compliqué.

Tu vas donc aller dans Panneau d'administration > Modules > (Tout en bas) Gestion des pages Javascript = Vérifie que tu as bien coché "oui" > Ajouter une nouvelle page Javascript > Sur toutes les pages de coché = met le titre que tu veux et ajoute ceci :

Code:
$(function() {
var a = ['http://adresse_image_1', 'http://adresse_image_2', 'http://adresse_image_3', 'http://adresse_image_4', 'http://adresse_image_5', 'http://adresse_image_6', 'http://adresse_image_7'];
$('#phpbb').css('background-image', 'url('+a[Math.floor(Math.random() * a.length)]+')');
});


Et enfin tu valides, je vais t'expliquer ce que j'ai fait en passant, si tu le souhaites.

Code:
$(function(){ // Déclare la fonction suivante en jQuery

Code:
var a = ['http://adresse_image_1', 'http://adresse_image_2', 'http://adresse_image_3', 'http://adresse_image_4', 'http://adresse_image_5', 'http://adresse_image_6', 'http://adresse_image_7']; // Ajoute une variable nommée "a" qui est égal à chaque adresse url fourni

Code:
$('#phpbb').css('background-image', 'url('+a[Math.floor(Math.random() * a.length)]+')'); // Un peu plus compliqué, on cible le corps de page (body) de ton forum, on y ajoute comme propriété css "background-img", pour définir la propriété, on va donc utiliser une fonction jQuery qui permet de générer un nombre aléatoire, ce nombre aura pour minimum 1 et pour maximum le nombre de lien fourni dans la variable a (donc ici 7), une fois le nombre généré on récupère l'url correspondant dans la variable "a", une fois cela fais, on l'ajoute à la propriété background image dans "url()" qui permet de définir l'url du background

Code:
}); // On ferme la fonction tout simple


Voilà, je sais pas si mes explications seront clair et si elles te serviront à quelque chose mais je préférais expliquer plutôt que de te donner un code et te laisser dans le flou avec, ça marche et osef de son effet XD
par Alzufen
le Dim 1 Mar 2015 - 22:45
 
Rechercher dans: Archives des problèmes avec l'apparence du forum
Sujet: Bannière de fond de page aléatoire (phpBB3)
Réponses: 6
Vues: 2013

Revenir en haut

Sauter vers: