CSS mettre un fond de site aléatoirement

Résolu/Fermé

Joffrey - 9 nov. 2010 à 14:10
playboy-1990 Messages postés 458 Date d'inscription samedi 27 mars 2010 Statut Membre Dernière intervention 10 septembre 2016 - 9 nov. 2010 à 17:15

Bonjour,

Je viens ici car j'ai besoin de votre aide. Voici la balise body dans mon fichier.css

body {
	margin:0 auto;
	padding:0px 0px 0px 0px;
	background:#000000 url(https://www.pagesjaunes.fr/ repeat-x ;
	background-repeat:no-repeat;
	background-position: top center;
	font-family:Arial, Century gothic,Tahoma,sans-serif;
	font-size:13px;
	}

J'aurai voulu savoir comment afficher aléatoirement un fond ecran différent sur mon site.
J'ai les fond : fond1.jpg fond2.jpg et fond3.jpg
Comment les afficher aléatoirement au chargement des pages ?

Merci d'avance.

A voir également:

CSS mettre un fond de site aléatoirement
Site de telechargement - Accueil - Outils
Site comme coco - Accueil - Réseaux sociaux
Site de vente en ligne particulier - Guide
Quel site remplace coco - Accueil - Réseaux sociaux
Site inaccessible - Guide

3 réponses

Réponse 1 / 3

jalalnet Messages postés 293 Date d'inscription mardi 20 octobre 2009 Statut Membre Dernière intervention 30 juillet 2023 10
9 nov. 2010 à 14:59

tu peut pas faire avec de CSS,faut du javascript
voila j'ai fais le code pour toi

<head>
<style type="text/css">
body
{
background:url(1.jpg);
}
</style>
// le script js
<script type="text/javascript">
var compteur=0
tbimage=new Array('1.jpg','2.jpg','3.jpg')

function pouic(){

if(compteur==tbimage.length){
compteur=0
}
document.body.style.cssText='background:url('+tbimage[compteur]+')'
compteur++
setTimeout(pouic,2000)
}
</script>
</head>
<body onload='pouic()'>

</body>
</html>

Réponse 2 / 3

coeus Messages postés 3021 Date d'inscription samedi 13 janvier 2007 Statut Membre Dernière intervention 19 juin 2013 119
9 nov. 2010 à 15:15

Ou sinon, tu mets ce bout de code CSS directement sur une page PHP (par exemple index.php, vu que ça concerne le Body c'est pas trop grave), et au chargement de la page tu génères un nombre aléatoire qui déterminera le fond...

<?php
$fond = rand(1,4);
?>

<style>

body {
background-image:url("fond<?php print $fond; ?>.jpg");
}

</style>

jalalnet Messages postés 293 Date d'inscription mardi 20 octobre 2009 Statut Membre Dernière intervention 30 juillet 2023 10
9 nov. 2010 à 15:28

g² j'ai testé chez moi ça marche bien j'avait aucune aidé quand peut combiné du css avec php

jalalnet Messages postés 293 Date d'inscription mardi 20 octobre 2009 Statut Membre Dernière intervention 30 juillet 2023 10
9 nov. 2010 à 15:33

dommage ça marche que si le code CSS sur la page PHP

playboy-1990 Messages postés 458 Date d'inscription samedi 27 mars 2010 Statut Membre Dernière intervention 10 septembre 2016 273
Modifié par playboy-1990 le 9/11/2010 à 15:43

Sinon tu peux créer une feuille de style en php et non en css
Moi je fait comme ça
Ta page index.php
tu mets :

 <link rel="stylesheet" href="./style.php" type="text/css" media="screen, projection" />

et dans ta feuille de style.php tu mets

header('content-type: text/css');  
header('Cache-Control: max-age=3600'); 
  $offset = 60 * 60 * 24 * 3; 

  $ExpireString = "Expires: " . gmdate("D, d M Y H:i:s", time() + $offset) . " GMT"; 

$fond = rand(1,4); 
?> 
body { 
background-image:url("fond<?php print $fond; ?>.jpg"); 
}

La page style en php ne prend de cache donc j'ai résolu le problème avec les header ;)

Twinpics
9 nov. 2010 à 15:50

Bonjour,

Tu mets le script de coeus directement dans ta feuille de style en l'enregistrant au format PHP (par exemple style.php) tu inclus dans cette feuille de style la ligne suivante :

header("Content-type: text/css");

Puis dans ta page HTML tu appelles ta feuille de style normalement :

<link rel="stylesheet" type="text/css" media="screen" href="style.php" />

--------------------------------------------------------------------------------------------------------------------------------
<* Suivez-moi sur FesseS-Bouc *>

roxan
9 nov. 2010 à 15:54

Merci playboy-1990 ton exemple est génial !

Réponse 3 / 3

jalalnet Messages postés 293 Date d'inscription mardi 20 octobre 2009 Statut Membre Dernière intervention 30 juillet 2023 10
9 nov. 2010 à 16:14

playboy-1990
j'ai essayé ton code mais la page style.php prend du cache même en supprimant cette page le page index continue de chargé le style du mémoir

playboy-1990 Messages postés 458 Date d'inscription samedi 27 mars 2010 Statut Membre Dernière intervention 10 septembre 2016 273
9 nov. 2010 à 16:22

Oups
Supprime alors

header('Cache-Control: max-age=3600'); 
  $offset = 60 * 60 * 24 * 3; 

  $ExpireString = "Expires: " . gmdate("D, d M Y H:i:s", time() + $offset) . " GMT";

jalalnet Messages postés 293 Date d'inscription mardi 20 octobre 2009 Statut Membre Dernière intervention 30 juillet 2023 10
9 nov. 2010 à 16:31

c bon merci , mais tu peut dire a quoi sert se bout de code

header('Cache-Control: max-age=3600'); 
  $offset = 60 * 60 * 24 * 3; 

  $ExpireString = "Expires: " . gmdate("D, d M Y H:i:s", time() + $offset) . " GMT";

playboy-1990 Messages postés 458 Date d'inscription samedi 27 mars 2010 Statut Membre Dernière intervention 10 septembre 2016 273
9 nov. 2010 à 17:15

La page style en php ne prend de cache donc j'ai résolu le problème les entêtes header ;)

Discussions similaires

C'est quoi le site qui remplace coco chat

Colis en cours de transport vers votre site de livraison ?