Page de veille

Version imprimable

26/04/2017, 18h46
toninou

Page de veille

Bonjour, je souhaiterais faire disparaître la totalité du contenu ma page html de 22h à 6h30 et pendant ce temps avoir seulement une photo toujours sur la même page et à partir de 6h30 remettre le contenue de ma page html. Comment faire?

Merci de votre aide.
26/04/2017, 19h06
Kennel sébastien

Bonjour toninou,

C'est plutôt du coter serveur que tu fais ça…

Cependant en javascript, en gros c'est faire un « innerHTML » sur « body ».

Et utiliser l'objet « Date ».

D'accord. Sinon j'ai vu qu'il y avait une méthode en php en changeant les css.
Le code est
Code:

1 2 3 4 5 6 7 8 9 10 <?php $h = date('g'); if($h>8&&$h<18){ echo'<link rel ="stylesheet" type="text/css" href="css_jour.css" />'; }else{ echo'<link rel ="stylesheet" type="text/css" href="css_nuit.css" />'; } ?>
Mais il ne marche pas.

26/04/2017, 19h43
Kennel sébastien

Regarde la doc :
http://php.net/manual/fr/function.date.php

« g Heure, au format 12h, sans les zéros initiaux 1 à 12 »
26/04/2017, 19h45
eleydet

Bonsoir,

Récupérer l'heure sur le client n'est pas une bonne idée, le client pouvant être configuré avec n'importe qu'elle heure.

Il me semble préférable de récupérer l'heure sur le serveur, à intervalle régulier, par exemple toutes les quinze minutes, avec une requête de type ajax. Ensuite, selon le retour, on modifie ou pas la page.

Je ne souhaite pas le faire en jax. Et ce code?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<link rel="stylesheet" type="text/css" href="css/base.css" />
<link rel="stylesheet" type="text/css" href="css/<?php echo($css)?>" />
 
        <?php
// On récupère la date d'aujourd'hui.
$date = getdate();
 
// Voici les conditions. L'expression à comparer est mise dans le switch
switch ($hours = $date["hours"]){
  // Puis on met les possibilités dans les case. On pense bien au break, c'est important
  case ( $hours < 6 ):
     $css = ".css";
  // Je me répète, mais c'est vraiment important, le break
  break;
 
  case ($hours < 22):
    $css = "stylehorloge.css";
  break;
 
  default:
    $css = "stylehorloge.css";
  break;
}
?>

Pourquoi ne pas faire simplement ? :

Code:

1
2
3
4
5
$hours = (int) getdate()["hours"];
 
if($hours > 6 && $hours < 22) {
    echo '<link rel="stylesheet" type="text/css" href="css/stylehorloge.css" />';
}

27/04/2017, 11h43
toninou

Ce css ne s'affichera rien que le jour mais après l'autre il faut que je le fasse avec un else if non?
27/04/2017, 11h47
Kennel sébastien

Oui un simple « else »

Si je fais ca c'est bon?

Code:

1
2
3
4
5
6
7
8
$hours = (int) getdate()["hours"];
 
if($hours > 6 && $hours < 22) {
    echo '<link rel="stylesheet" type="text/css" href="css/stylehorlogejour.css" />';
}
else($hours > 22 && $hours < 6) {
    echo '<link rel="stylesheet" type="text/css" href="css/stylehorlogenuit.css" />';
}

C'est plutôt quelque chose comme :

Code:

1
2
3
4
5
6
7
$hours = (int) getdate()["hours"];
 
if($hours > 6 && $hours < 22) {
    echo '<link rel="stylesheet" type="text/css" href="css/stylehorlogejour.css" />';
} else {
    echo '<link rel="stylesheet" type="text/css" href="css/stylehorlogenuit.css" />';
}

03/05/2017, 14h02
toninou

Ca ne marche pas car cela m'affiche ceci sur ma page :

Code:

6 && $hours < 22) { echo ''; } else { echo ''; } ?>
03/05/2017, 14h36
Kennel sébastien

Tu as une erreur dans les balises…

Peux-tu montrer le code de la page complète ?

Voila :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
<!DOCTYPE html>
<html>
    <head>
 
        <meta charset="utf-8" />
	<meta http-equiv="refresh" content="10800";http://192.168.43.108/ />	
        <title>EHPAD Adrienne Lugans</title>
 
 	<link rel="stylesheet" href="imagestyle.css"/>
 
	<script type="text/javascript" src="Java/heure.js"></script>                       <!-- link du javascript pour l'heure-->
	<script class="date" type="text/javascript" src="Java/date_heure.js"></script>     <!-- link du javascript pour la dates-->
	                      <!-- link du javascript pour les cloches-->
        <script type="text/javascript" src="Java/repas.js"></script>                       <!-- link du javascript pour affichage repas-->
	<script type="text/javascript" src="Java/saison.js"></script>                      <!-- link du javascript pour affichage saison-->
		<?php
        $hours = (int) getdate()["hours"];
 
if($hours > 6 && $hours < 22) {
    echo '<link rel="stylesheet" type="text/css" href="css/stylehorlogejour.css" />';
} else {
    echo '<link rel="stylesheet" type="text/css" href="css/stylehorlogenuit.css" />';
}
        ?>
 
 
    </head>
 
    <body>
 
	<table border="0" cellpadding="0" cellspacing="0" width="100%">
	<tr>
		<th>
			<center><a href="mdp.html"><img class="logoehpad" src="Image/logo.png"></a></center>
			<br/>
			<br/>
 
 
		</th>
 
		<th>	
			<span  id="date_heure"></span>
        		<script type="text/javascript">window.onload = date_heure('date_heure');</script>
			<br/>
			<span id="heure"></span>
			<script type="text/javascript">window.onload = heure('heure');</script>	
		</th>	
	</tr>
 
 
 
 
	<table border="1" cellpadding="0" cellspacing="0" width="100%" height="300";overflow:hidden>
   	<tr>
      		<th><font size="7"><font color="#B63920">SAISON</font></font></th>
      		<th><font size="7"><font color="#B63920">METEO</font></font></th>
      		<th><font size="7"><font color="#B63920">REPAS</font></font></th>
      		<th><font size="7"><font color="#B63920">INFORMATION</font></font></th>
   	</tr>
   	<tr>
      		<td>
			<a id="img5"><center><img src="Saison/PRINTEMPS.png" alt="printemps"></center></a>
			<a id="img6"><center><img src="Saison/ETE.png" alt="ete"></center></a>
			<a id="img7"><center><img src="Saison/AUTOMNE.png" alt="automne"></center></a>
			<a id="img8"><center><img src="Saison/HIVER.png" alt="hiver"></center></a>
			<div id="saison"></div>
      		</td>
      		<td>
			<center><div style="width:400px; overflow:hidden">
			<img src="https://www.tameteo.com/wimages/foto77bef7731544fb31820989dae1249d00.png"
			style="width:430px; margin: -130px -430px -90px -430px;"/>
			</div></center>
		</td>
      		<td>
			<a id="img1"><center><img src="Repas/Petit dejeuner.png" alt="petitdej"></center></a>
			<a id="img2"><center><img src="Repas/dejener.png" alt="dejener"></center></a>
			<a id="img3"><center><img src="Repas/gouter.png" alt="gouter"></center></a>
			<a id="img4"><center><img src="Repas/souper.png" alt="souper"></center></a>
			<div id="essai"></div>
      		</td>
      		<td>
 
		</td>
   	</tr>
 
 
	</body>
 
</html>

03/05/2017, 15h16
Kennel sébastien

D'accord mais là ton code PHP il doit être exécuter sous un serveur, comme apache ou autre.

Car si tu exécutes ton fichier sans passer par le serveur c'est normal qu'il affiche :

Code:

6 && $hours < 22) { echo ''; } else { echo ''; } ?>

Le code serveur n'étant pas traité…
03/05/2017, 15h18
toninou

Pour le moment je travaille sur Brackets donc je ne suis pas sur mon serveur. Il faut dans ce cas que je le mette sur mon serveur apache.
03/05/2017, 15h25
Kennel sébastien

Tu peux très bien installer apache et php en local

et exécuter les pages par l'adresse localhost
04/05/2017, 10h17
toninou

J'ai essayé sur le serveur ca ne fonctionne pas, le css ne change pas. Comment je fais?

Tu as bien défini le fuseau horaire quelque part ?

Comme :

Code:

1
2
3
4
5
6
7
8
9
date_default_timezone_set('Europe/Paris');
 
$hours = (int) getdate()["hours"];
 
if($hours > 6 && $hours < 8) {
    echo '<link rel="stylesheet" type="text/css" href="css/stylehorlogejour.css" />';
} else {
    echo '<link rel="stylesheet" type="text/css" href="css/stylehorlogenuit.css" />';
}

04/05/2017, 13h36
vins86

Bonjour toninou,

Qu'est qu'y te gêne pour l'ajax? Si la personne se connecte à 21h55 et qu'il ne réactualise pas la page à 22h00 il n'aura pas le css de nuit. Et tu pourrais en plus faire une feuille de style et en fonction du jour et de la nuit changer les noms classe et id pour changer le style de façon dynamique et propre.
16/05/2017, 09h05
toninou

Disons que je n'ai jamais fais d'ajax.
16/05/2017, 09h44
Kennel sébastien

Il y a un début à tout, Ajax n'est rien d'autre qu'un objet « XMLHttpRequest », ce n'est pas très compliqué.
23/05/2017, 10h25
toninou

Je n'ai jamais fais d'ajax et je ne sais pas du tout à quoi pourrais ressembler le code.
06/06/2017, 09h11
toninou

D'accord! Mais est ce qu'il serait possible que tu m'envoies le code en ajax si ça ne te dérange pas?
Merci;
06/06/2017, 11h37
NoSmoking

Bonjour,

Citation:

Je n'ai jamais fais d'ajax...

Les meilleurs cours et tutoriels pour apprendre l'AJAX
08/06/2017, 09h24
toninou

J'ai cherché pour changer de css en Ajax mais je ne trouve pas. Est ce que quelqu'un pourrait me donner un coup de main?
Merci
08/06/2017, 09h52
NoSmoking

:koi: pas compris ce que tu cherches à faire !
08/06/2017, 10h10
toninou

Je souhaite afficher un CSS de 6h30 à 22h30 et un autre de 22h30 à 6h30 sur ma page principale.

Du coup, j'ai fait ça :

Code:

1
2
3
4
5
6
7
8
9
10
11
<?php
		date_default_timezone_set('Europe/Paris');
 
$hours = (int) getdate()["hours"];
 
if($hours > 6 && $hours < 13) {
    echo '<link rel="stylesheet" type="text/css" href="stylehorloge.css" />';
} else {
    echo '<link rel="stylesheet" type="text/css" href="stylehorlogenuit.css" />';
}
        ?>

Il ne me manque plus qu'à actualiser la page régulièrement.