Logo SNS - Web et Informatique

SNS - Web et Informatique

Samedi 14 Décembre 2019
06 25 23 34 56
12150, Sévérac-le-Château
 08h00/23h00 - 7j/7
Être rappelé
Afficher Masquer un bloc, du texte ou une image en PHP

Afficher Masquer un bloc, du texte ou une image en PHP

Publié le .

On a parfois besoin d'afficher ou de masquer
du texte, un bloc ou une image au sein d'une page web.
Ce qu'on cherche à obtenir c'est qu'un visiteur puisse afficher ou
cacher un élément HTML lors d'un clic sur un bouton ou un lien.
Cette action est possible en PHP sans passer par le JavaScript
d'autant plus qu'il est désactivable.
Dans ce TUTORIEL je vous explique comment faire apparaître ou disparaître
un bloc mais aussi une image, du texte, bref, afficher ou cacher
tout ce qu'on veut lors d'un clic sur un bouton.
Un exemple du script est visible ICI www.sns.pm/ONOFF.php.

<?php
 // On teste d'abord si "Afficher..." vaut "on"
// Si oui : On change les styles du bloc pour l'afficher,
// On attribue une nouvelle valeur "Masquer..." au bouton
// On ré-attribue la valeur "off" à l'input hidden
// qui cachera le bloc en envoyant $_POST['off']
// sur cette même page.
if ( isset($_POST['on']) )
{
$display = "display: block; border: 2px solid blue; text-align: center;" ;
$value_button = "Masquer ce block";
$hidden_name = "off";
}
// Si $_POST vaut "off" OU si $_POST est vide au démarrage du script :
// On cache le bloc
// On prépare l'affichage du bloc en attribuant la valeur "on"
// à l'input hidden, on règle la valeur du bouton sur "Afficher...""
elseif ( isset($_POST['off']) || empty($_POST) )
{
$display = "display: none;" ;
$value_button = "Afficher un block, du texte ou une image";
$hidden_name = "on";
}
// Valeurs par défault / ou / si on manipule la valeur de $_POST
else {
$display = "display: none;" ;
$value_button = "Afficher un block, du texte ou une image";
$hidden_name = "on";
}
// Affichage HTML du bloc et du formulaire
// note : Le formulaire n'est en rien attaché au bloc
echo '

<div style = "'.$display.'">

<div style="float: right;">
<form action="ONOFF.php" method="post" />
<input type="hidden" name="'.$hidden_name.'">
<button type="submit"> X </button>
</form>
</div>

<p>
<b>On peut afficher un élément masqué auparavant</b>
</p>

<img src="img/PHP_logo.png" title="Logo php" />

<p>
Un peut de texte s\'affiche maintenant.<br>
Il peut être masqué lors d\'un click<br>
sur le même bouton ci-dessous, pratique non ?
</p>

</div>

<p>
<form action="ONOFF.php" method="post">

<input type="hidden" name="'.$hidden_name.'">
<input type="submit" value="'.$value_button.'">

</form>
</p>

';?>
SNS - Web & Informatique | www.sns.pm | 2013 - 2019