Fond aléatoire

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

Résolu Fond aléatoire

Message par maverickkinai le Jeu 14 Mai 2015 - 16:52

Détails techniques


Version du forum : phpBB3
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Autre
Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : Fond aléatoire
Lien du forum : http://ed92.forumactif.org/

Description du problème

Bonjour je souhaiterais créer un entete avec une image aléatoire.
Actuellement le fond de mon forum est régi par la css et l'image de fond de forum dans le PA--> Gestion des images est invisible.
Voici le code qui gère le fond du forum, je souhaiterais créer uniquement une image aléatoire en remplacement de la première Url, tout en conservant le design actuel.

body {
background-image: url("http://nsm08.casimages.com/img/2015/04/29//15042912024311954313216956.jpg"), url("http://nsm08.casimages.com/img/2015/05/03//15050301022311954313230469.png");
background-position: top center, center;
background-repeat: no-repeat, repeat-y;
}

En insérant ce code dans la css et en mettant une image invisible dans la première url du code body, j'arrive presque à la solution mais la duxième url du body ne marche plus: .ban1 { background-image: url('http://nsm08.casimages.com/img/2015/04/29//15042912024311954313216956.jpg'); }
.ban2 { background-image: url('http://nsm08.casimages.com/img/2015/05/02//15050208545111954313229020.png'); }
.ban3 { background-image: url('http://nsm08.casimages.com/img/2015/05/08//15050806151011954313248328.jpg'); }


Dernière édition par maverickkinai le Jeu 21 Mai 2015 - 15:53, édité 1 fois

maverickkinai
**

Messages : 81
Inscrit(e) le : 12/05/2011

http://www.warbirdspassion.com/
maverickkinai a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Fond aléatoire

Message par maverickkinai le Ven 15 Mai 2015 - 16:29

Up Smile

maverickkinai
**

Messages : 81
Inscrit(e) le : 12/05/2011

http://www.warbirdspassion.com/
maverickkinai a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Fond aléatoire

Message par no_way le Ven 15 Mai 2015 - 22:18

Bonjour Smile, peut-on savoir quelles sont les images aléatoires en question pour votre fond ?

no_way
Aidactif
Aidactif

Messages : 1782
Inscrit(e) le : 26/03/2010

no_way a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Fond aléatoire

Message par maverickkinai le Dim 17 Mai 2015 - 16:58

@no_way a écrit:Bonjour Smile, peut-on savoir quelles sont les images aléatoires en question pour votre fond ?
Bien sûr Smile :









maverickkinai
**

Messages : 81
Inscrit(e) le : 12/05/2011

http://www.warbirdspassion.com/
maverickkinai a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Fond aléatoire

Message par no_way le Dim 17 Mai 2015 - 21:35

Essayez avec le code suivant Smile:
Code:
$(function() {
var a = [
"http://i19.servimg.com/u/f19/15/71/54/28/15042910.jpg",
"http://i19.servimg.com/u/f19/15/71/54/28/15050210.jpg",
"http://i19.servimg.com/u/f19/15/71/54/28/swd_fo10.jpg",
"http://i19.servimg.com/u/f19/15/71/54/28/15051710.jpg"
];
$("body").css("background-image",'url("'+a[Math.floor(Math.random() * a.length)]+'"),url("http://nsm08.casimages.com/img/2015/05/03//15050301022311954313230469.png")')
});

no_way
Aidactif
Aidactif

Messages : 1782
Inscrit(e) le : 26/03/2010

no_way a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Fond aléatoire

Message par maverickkinai le Lun 18 Mai 2015 - 14:52

Bonjour,malheureusement aucunes images ne s'affichent Smile

maverickkinai
**

Messages : 81
Inscrit(e) le : 12/05/2011

http://www.warbirdspassion.com/
maverickkinai a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Fond aléatoire

Message par no_way le Lun 18 Mai 2015 - 16:59

Bonjour, le script fonctionne pourtant: voir.
puis-je avoir le code CSS que vous utilisez pour le moment ?

no_way
Aidactif
Aidactif

Messages : 1782
Inscrit(e) le : 26/03/2010

no_way a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Fond aléatoire

Message par maverickkinai le Lun 18 Mai 2015 - 18:36

@no_way a écrit:Bonjour, le script fonctionne pourtant: voir.
puis-je avoir le code CSS que vous utilisez pour le moment ?

Effectivement, c'est bizarre, les images me paraissent plus petite? Smile
Bien sûr, voici ma css:

.table-title, .table-title h2 {
color: #FFFFFF;
display: inline;
font-size: 1.1em;
font-weight : bold;
}.postprofile {width:17%}
.postbody {width:80%}

#search-box {display: none;}
.forabg {
box-shadow: 2px 2px 5px #727272;
border: none;
margin-bottom: 10px;
}

.forumbg {
box-shadow: 2px 2px 5px #727272;
border: none;
margin-bottom: 10px;
}

.module {
box-shadow: 2px 2px 5px #727272;
border: none;
margin-bottom: 0px;
}

.portal .module {
margin-bottom: 10px;
}

div.panel.introduction {
background: #f5f5f5;
}

.h3 {color:#6A3CB9;}

.module .h3 {
border: none;
}
.navbar ul{
border-bottom:none;
}
ul.forums dd {
border: none;
}
.forabg {
margin-bottom: 25px;
}
.forumbg {
margin-bottom: 25px;
}

.signature_div img {

max-height:100px;
max-width:400px;
}
body {
background-image: url("http://nsm08.casimages.com/img/2015/05/17//15051711214811954313274993.jpg"), url("http://nsm08.casimages.com/img/2015/05/03//15050301022311954313230469.png");
background-position: top center, center;
background-repeat: no-repeat, repeat-y;
}

J'ai supprimé les dernières lignes de code body/background,pour le remplacer par votre code, mais peut être à tord

maverickkinai
**

Messages : 81
Inscrit(e) le : 12/05/2011

http://www.warbirdspassion.com/
maverickkinai a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Fond aléatoire

Message par no_way le Mar 19 Mai 2015 - 6:15

les images me paraissent plus petite?
Les images sont plus petites car vous les avez hébergé via servimg et j'imagine que le redimensionnement de l'image était à "800px pour les forums" au lieu de "non".

Hébergez à nouveau vos images et cette fois-ci sans redimensionnement puis indiquez moi leur URL Very Happy

no_way
Aidactif
Aidactif

Messages : 1782
Inscrit(e) le : 26/03/2010

no_way a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Fond aléatoire

Message par maverickkinai le Mer 20 Mai 2015 - 12:11

D'accord, merci Smile
Voilà les images Wink








maverickkinai
**

Messages : 81
Inscrit(e) le : 12/05/2011

http://www.warbirdspassion.com/
maverickkinai a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Fond aléatoire

Message par no_way le Mer 20 Mai 2015 - 14:40

Super voici le nouveau javascript:
Code:
$(function() {
        var a = [
        "http://nsm08.casimages.com/img/2015/05/17/15051711214811954313274993.jpg",
        "http://nsm08.casimages.com/img/2015/04/29/15042912024311954313216956.jpg",
        "http://nsm08.casimages.com/img/2015/05/17/15051711214811954313274993.jpg",
        "http://nsm08.casimages.com/img/2015/05/02/15050208545111954313229020.png",
        "http://nsm08.casimages.com/img/2015/05/20/15052012084311954313283564.jpg"
        ];
        $("body").css("background-image",'url("'+a[Math.floor(Math.random() * a.length)]+'"),url("http://nsm08.casimages.com/img/2015/05/03/15050301022311954313230469.png")')
        });
et vous pouvez remplacer dans votre CSS:
Code:
body {
background-image: url("http://nsm08.casimages.com/img/2015/05/17//15051711214811954313274993.jpg"), url("http://nsm08.casimages.com/img/2015/05/03//15050301022311954313230469.png");
background-position: top center, center;
background-repeat: no-repeat, repeat-y;
}
par:
Code:
body {
background-image: url("http://nsm08.casimages.com/img/2015/05/17//15051711214811954313274993.jpg"), url("http://nsm08.casimages.com/img/2015/05/03/15050301022311954313230469.png");
background-position: top center, center;
background-repeat: no-repeat, repeat-y;
}

no_way
Aidactif
Aidactif

Messages : 1782
Inscrit(e) le : 26/03/2010

no_way a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Fond aléatoire

Message par maverickkinai le Jeu 21 Mai 2015 - 15:52

Franchement MERCIIIIII !!! ça marche d"enfer,c'est tout à fait le résultat espéré ! MERCI ! Very Happy

maverickkinai
**

Messages : 81
Inscrit(e) le : 12/05/2011

http://www.warbirdspassion.com/
maverickkinai 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