begin process at 2012 02 13 03:45:44
  Trouver un code source :
 
dans
 
[ Dernières recherches ]
Accueil > 

Code

 > 

Javascript / DHTML

 > BOITE HTML/JAVASCRIPT RÉDUCTIBLE

BOITE HTML/JAVASCRIPT RÉDUCTIBLE


 Information sur la source

Note :
Aucune note
Catégorie :Javascript / DHTML Niveau :Débutant Date de création :19/03/2005 Date de mise à jour :20/03/2005 13:19:47 Vu / téléchargé :7 238 / 489
Auteur : nuchoon

Ecrire un message privé
Site perso
Commentaire sur cette source (9)
Ajouter un commentaire et/ou une note

 Description

Cette fonction crée une boite en html avec 3 divs: 1 pour la boite, 1 pour le titre de la boite, 1 pour le contenu de la boite.
On peut aussi passer en argument l'état de la boite, si le contenu doit être affiché ou non, ainsi que l'id du contenu de la boite (nécessaire si on veut que l'état de la boite soit mémorisé d'une page à l'autre).
Si l'id n'est pas fourni, alors il est généré (de façon aléatoire).

Source

  • <?
  • /* fabrique une boite en html avec possibilité de fermer/ouvrir le contenu */
  • function mkHtmlBox($boxtitle,$boxcontent,$boxdisplaystate="",$boxcontentid=""){
  • if($boxcontentid==""){
  • $min=10; /* longueur minimum de l'id */
  • $max=10; /* longueur maximum de l'id */
  • for($i=0;$i<rand($min,$max);$i++)
  • {
  • $num=rand(48,122);
  • if(($num > 97 && $num < 122))
  • {
  • $boxcontentid.=chr($num);
  • }
  • else if(($num > 65 && $num < 90))
  • {
  • $boxcontentid.=chr($num);
  • }
  • else if(($num >48 && $num < 57))
  • {
  • $boxcontentid.=chr($num);
  • }
  • else if($num==95)
  • {
  • $boxcontentid.=chr($num);
  • }
  • else
  • {
  • $i--;
  • }
  • }
  • }
  • if($boxdisplaystate=="closed"){
  • $display="style=\"display:none;\"";
  • }
  • if($boxdisplaystate=="opened"){
  • $display="style=\"display:block;\"";
  • }
  • if($boxdisplaystate==""){
  • if(isset($_COOKIE[$boxcontentid])){
  • $display="style=\"display:$_COOKIE[$boxcontentid];\"";
  • }
  • else{
  • $display="style=\"display:block;\"";
  • }
  • }
  • echo(
  • "<div class=\"box\">"
  • ."<div class=\"box-title\">"
  • ."<a href=\"#\" onClick=\"document.getElementById('$boxcontentid').style.display='block';document.cookie='$boxcontentid=block';\">"
  • ."<img src=\"downarrow.gif\" alt=\"montrer\" border=\"0\" title=\"".BOX_SHOW."\"/></a>"
  • ."<a href=\"#\" onClick=\"document.getElementById('$boxcontentid').style.display='none';document.cookie='$boxcontentid=none';\">"
  • ."<img src=\"uparrow.gif\" alt=\"cacher\" border=\"0\" title=\"".BOX_HIDE."\"/></a>"
  • ."&nbsp;"
  • ."<a href=\"#\" onClick=\"if(document.getElementById('$boxcontentid').style.display=='none'){document.getElementById('$boxcontentid').style.display='block';document.cookie='$boxcontentid=block';}else{document.getElementById('$boxcontentid').style.display='none';document.cookie='$boxcontentid=none';}\" title=\"".BOX_SHOWHIDE."\">".$boxtitle."</a>"
  • ."</div>"
  • ."<div class=\"box-content\" id=\"$boxcontentid\""." ".$display.">"
  • .$boxcontent
  • ."</div>"
  • ."</div>"
  • );
  • }
  • ?>
<?
/* fabrique une boite en html avec possibilité de fermer/ouvrir le contenu */

function mkHtmlBox($boxtitle,$boxcontent,$boxdisplaystate="",$boxcontentid=""){
  
  if($boxcontentid==""){ 
    $min=10; /* longueur minimum de l'id */
    $max=10; /* longueur maximum de l'id */
    
    for($i=0;$i<rand($min,$max);$i++)
    {
      $num=rand(48,122);

    if(($num > 97 && $num < 122))
    {
      $boxcontentid.=chr($num);
    }

    else if(($num > 65 && $num < 90))
    {
      $boxcontentid.=chr($num);
    }

    else if(($num >48 && $num < 57))
    {
      $boxcontentid.=chr($num);
    }

  else if($num==95)
  {
      $boxcontentid.=chr($num);
  }

  else
  {
      $i--;
  }
}
  }
  if($boxdisplaystate=="closed"){
    $display="style=\"display:none;\"";
  }
  if($boxdisplaystate=="opened"){
    $display="style=\"display:block;\"";
  }
  if($boxdisplaystate==""){
    if(isset($_COOKIE[$boxcontentid])){
      $display="style=\"display:$_COOKIE[$boxcontentid];\"";
    }
    else{
      $display="style=\"display:block;\"";
    }
  }
  
  echo(
     "<div class=\"box\">"
    ."<div class=\"box-title\">"
    ."<a href=\"#\" onClick=\"document.getElementById('$boxcontentid').style.display='block';document.cookie='$boxcontentid=block';\">"
    ."<img src=\"downarrow.gif\" alt=\"montrer\" border=\"0\" title=\"".BOX_SHOW."\"/></a>"
    ."<a href=\"#\" onClick=\"document.getElementById('$boxcontentid').style.display='none';document.cookie='$boxcontentid=none';\">"
    ."<img src=\"uparrow.gif\" alt=\"cacher\" border=\"0\" title=\"".BOX_HIDE."\"/></a>"
    ."&nbsp;"
    ."<a href=\"#\" onClick=\"if(document.getElementById('$boxcontentid').style.display=='none'){document.getElementById('$boxcontentid').style.display='block';document.cookie='$boxcontentid=block';}else{document.getElementById('$boxcontentid').style.display='none';document.cookie='$boxcontentid=none';}\" title=\"".BOX_SHOWHIDE."\">".$boxtitle."</a>"
    ."</div>"
    ."<div class=\"box-content\" id=\"$boxcontentid\""." ".$display.">"
    .$boxcontent
    ."</div>"
    ."</div>"
  );
  
}

?>

 Conclusion

Pour générer un id aléatoire j'ai utilisé une fonction (offerte) d'un auteur anglophone. J'ai malheureusement oublié son nom, alors je m'excuse d'avance et je corrigerai si il se reconnait.
Je fourni un fichier d'exemple ainsi que 2 petites images (sinon tout le reste du look c'est en css).
Ah oui... les balises alt font appel à des constantes.
Les améliorations sont bienvenues celà va de soi!

 Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip


 Historique

20 mars 2005 13:19:49 :
Changement de "initié" vers "débutant".

 Sources du même auteur

Source avec Zip Source avec une capture LECTEUR/GESTIONNAIRE DE MP3
Source avec Zip Source avec une capture GALERIE AJAX ET REDIMENSIONNEMENT D'IMAGE EN PHP
Toutes les sources de nuchoon

 Sources de la même categorie

Source avec Zip Source avec une capture PHPJSVFORM : DES CLASSES PHP, DES JAVASCRIPTS POUR CRÉER FAC... par synanceia
BOUTON POUR SITE WEB PAYMENT par Tom56340
Source avec Zip Source avec une capture PETIT CLIENT + AJAX + PHP par kiki67100
Source avec Zip Source avec une capture BOÎTE À ONGLETS / MENUS ET SOUS-MENUS / JAVASCRIPT / PHP / D... par Heirem
Source avec Zip Source avec une capture JUKEBOX EN LIGNE par Flachy Joe
Toutes les sources de la catégorie Javascript / DHTML

Commentaires et avis

Commentaire de Anthomicro le 19/03/2005 15:32:27

J'adore le code initié comme ça, tout le monde maîtrise PHP sur le bout des doigts si ce code est initié...

<? à remplacer par <?php

if(($num > 97 && $num < 122)) (et accessoirement toutes les vérifs basées sur ce modèle) : à remplacer par ça (pour les parenthèses) :

if($num > 97 AND $nom < 122)

Ensuite tu sais que $nom est toujours de type numérique, antant remplacer le double égal par un triple :

if($num===95)

Ensuite les echo avec des doubles quotes sont inappropriés ici vu que t'es obligé de les échapper dans les attributs html, autant faire ceci :

    echo '<div class="box">
<div class="box-title">
<a href="#" onClick="document.getElementById(\'',$boxcontentid,'\').style.display=\'block\';document.cookie=\'',$boxcontentid=block,'\';">
<img src="downarrow.gif" alt="montrer" title="',BOX_SHOW,'" /></a>[...]';

a +

Commentaire de Cyberboy2054 le 19/03/2005 20:25:20

Ca change quoi le AND à la place du && ?
Ensuite tu peux expliquer ce que fait le === ?
C'est sympa de dire "c'est 1000 fois mieux de faire comme ca" afin d'aider les autres à progresser mais si ya pas d'explications ca sert à rien...

Commentaire de Anthomicro le 19/03/2005 20:36:46

le AND c'est pas bien grave, c'est juste une question de style, tu peux laisser le && (comparaison bit à bit)

Ensuite le === vérifie le type de ta variable, c'est à dire que si tu as une variable de type string (qui a pour valeur 1) et une autre variable de type int qui a également la valeur 1, ce test te retournera vrai :

if($var1==$var2) tandis que ce test if($var1===$var2) te retournera faux car les deux variables n'ont pas le même type. Le second test est plus rapide à traiter car les variables ne sont pas converties.

a +

Commentaire de Anthomicro le 19/03/2005 20:37:18

Puis pour les explications désolé, je croyais que c'était de l'initié ^^

Commentaire de ghostahjay le 20/03/2005 10:36:51

Juste pour dire que ton script est vraiment pas mal et peut aider dans beaucoup de projets qui a un menu multi-niveau et qui utilise PHP. En ce qui concerne le 'AND', tu pousse Anthomicro ;p
Merci pour cette source !

Commentaire de nuchoon le 20/03/2005 13:18:00

Pour la qualification "initié"... ben c'est juste parce que "débutant" je trouvais que ça ne collait pas. En plus c'est extrêmement flou comme truc. C'est quoi "initié"? on explique ce que ça veut dire quelque part?
Maintenant si c'est si grave que ça il y a peut-être moyen qu'un webmestre modifie le bousin...

Pour parler de choses plus intéressantes, est-ce qu'il y a moyen sur ce site de mettre à jour une contribution? J'aurai bien aimé redonner un zip avec toutes les modifications suggérées.

Commentaire de nuchoon le 20/03/2005 13:18:44

euh... j'ai rien dit, je viens de voir le lien là-haut... :-)

Commentaire de arnal69130 le 23/03/2005 17:25:36

salut nuchoon,
T'aurais pas une ptite capture d'écran stp ?

Commentaire de nuchoon le 23/03/2005 21:10:06

non mais ya un exemple (une version amélioré, le cookie prévaut sur l'argument "closed" ou "opened") ici: www.nuchoon.com

 Ajouter un commentaire

Nos sponsors


Sondage...

CalendriCode

Février 2012
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
272829    

Consulter la suite du CalendriCode

Photothèque

Photo Green Energy Solutions With Light Bulb Morphed Into LandscapePhoto Beautiful woman in a bikini meditating on the beach
Photo bora-bora 

Visiter la photothèque
 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 4,462 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales
Outils Convertisseur VB/C# Snippets et scripts Outils en ligne La ToolBox
Communauté Programmation Photographie Technologie Newsgroups Emploi Forum Blogs
Guide d'achat Téléphonie mobile Image et son Informatique Bureautique Jeux vidéo
Logiciels Internet & Réseau Développement Market Android Jeux & Loisirs Graphisme Multimédia Sécurité Pilotes
Loisirs Cartes virtuelles Vidéos droles Jeux en ligne Géoguide AndroLib (Android Market)