Sur cette page quelques codes sources (PHP HTML JAVASCIPT CSS) que je récolte au fil du temps pour la réalisation de mes sites internet.
    Gestion des tableaux:

Aucune marge:

 


cellpadding="0" cellspacing="0"
    Codes JavaScript:

La page ce ralonge de 200 PX par 200 PX, pour les design avec une image verticale non linéaire:

(Code à ajouter a la fon de Body)

 

<script language="JavaScript" type="text/JavaScript">
var block = document.getElementById("corps"),
height = block.clientHeight,
mod = height % 200,
padding = 200 - mod+"px";

if (mod) block.style.paddingBottom = padding;
</script>



Afficher et masquer un DIV en cliquant sur un lien:

(Effet a bascule)

 

 


<script language="javascript"> 

function afficher(theid)
{
document.getElementById(theid).style.display =(document.getElementById(theid).style.display=='none')?'block':'none';
}
</script>

 

onClick="afficher('DIV_Presente_1')



    Codes PHP:

Inclure une page HTML dans une page PHP:



<?php nclude("kit_haut.html"); ?> 




Liste les images dans un dossier donner et affiche des vignett: (Fonctionne avec le script LogthBox)

 

  <?php 
$directoriest = glob(getcwd()."{/Gal_Selection/Photos/imgs/*.jpg,/Gal_Selection/Photos/imgs/*.JPG}",GLOB_BRACE);
foreach ($directoriest as $dirt)
{
$dir_3_t = str_replace('/home/lunnatic/www', '', $dir_2_t);
echo '<a href="'.$dir_3_t.'" data-lightbox="roadtrip"><img src="'.$dir_3_t.'" height="170" border="1" style="border-color:#000000"></a> &nbsp;';
}
?>


    Gestion des balise DIV en CSS:




Coller deux DIV cote à cote:

 
      float:left;
Ou bien:
 
      float:right;
Ajouter au DIV ou doit s'arrêter le colage de DIV:
 
      clear:both;





Angle arondi sur DIV:
 
      

.divarondi{
padding:25px 25px;
background-color: #464545;
border-radius: 30px;
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
}




Ombre sur DIV:

 
      .ombreDIV{
      
box-shadow: 8px 8px 0px #00000;
-moz-box-shadow;
-webkit-box-shadow;
}



DIV toujours en haut en position fixe et le contenu de la page remonte par desous:
Avec image qui se répéte horizontalement.

 

<div id="DIV_BAN_1" style="width:100%; background-color:#ffffff; background-image:url(image.jpg); background-position:left top; background-repeat:repeat-x;  left:0px; position:fixed; top: 0px;z-index:100000;" align="center">
</div>
    Les Boutons DIV CSS:

Un boutons arondi avec effet d'ombre en d'enfoncement au clique en DIV et CSS:
Le bouton et accompagner d'un code PHP qui lui permet de rester enfoncer lorsque l'on se trouve sur la page pointer par le lien du bouton en question.



 


<?php 
// obtenir le nom complet de la page active
$page_active = $_SERVER["PHP_SELF"];
// et la condition :
if (strpos($page_active,'mot_president.php')) {
?>
<div style="width:185px; height:25px;" onclick="location.href='mot_president.php'" class="DIV_Ombre_Bout_3"><div align="left"><a href="mot_president.php" class="a1">&nbsp;&nbsp; Mot du Président</a></div></div>
<?php } else { ?>
<div style="width:185px; height:25px;" onclick="location.href='mot_president.php'" onmouseover="this.className='DIV_Ombre_Bout_1'" onmouseout="this.className='DIV_Ombre_Bout_2'" class="DIV_Ombre_Bout_2" ><div align="left"><a href="mot_president.php" class="a1">&nbsp;&nbsp; Mot du Président</a></div></div>
<?php } ?>

.DIV_Ombre_Bout_1 {
padding:5px 5px;
border-radius: 60px;
-moz-border-radius: 60px;
-webkit-border-radius: 60px;
box-shadow: 0px 0px 15px 4px rgba(000, 000, 000, 0.30) inset;
-moz-box-shadow: 0px 0px 15px 4px rgba(000, 000, 000, 0.30) inset;
-webkit-box-shadow: 0px 0px 15px 4px rgba(000, 000, 000, 0.30) inset;
cursor: pointer;
}
.DIV_Ombre_Bout_2 {
padding:5px 5px;
border-radius: 30px;
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
box-shadow: 0px 0px 15px 4px rgba(000, 000, 000, 0.60);
-moz-box-shadow: 0px 0px 15px 4px rgba(000, 000, 000, 0.60);
-webkit-box-shadow: 0px 0px 15px 4px rgba(000, 000, 000, 0.60);
margin:7px;
}
.DIV_Ombre_Bout_3 {
background-color:#ffffff;
padding:5px 5px;
border-radius: 90px;
-moz-border-radius: 90px;
-webkit-border-radius: 90px;
box-shadow: 0px 0px 15px 4px rgba(000, 000, 000, 0.99);
-moz-box-shadow: 0px 0px 15px 4px rgba(000, 000, 000, 0.99);
-webkit-box-shadow: 0px 0px 15px 4px rgba(000, 000, 000, 0.99);
margin:7px;
}


    Fichiers testes:

Barre Menu Onglets 1    
Bouton 1    
Bouton Enfonce 1    
Bouton Enfonce 2    
Bouton Enfonce 3    
Bouton Enfonce 4    
DIV Fondu disparait 1    
DIV Pop Up 1    
DIVs Formes    
DIVs Formes Lozanges Lozange 1    
DIVs Formes Lozanges Lozange 1 2    
DIVs Formes Lozanges Lozange 1 3    
Hover effet super 1    
Hover effet super 1 2    
Image Effet Polaroid 1    
Inages Defilent 1    
Lien Double Div 1    
Menu Horizontal eBoutons 1    
Menu contextuel 1    
Ruban sous titre 1    
Ruban sous titre 1 modif 1    
effet image 1    
lightbox 1    
lightbox 2    
men 1    
menu 1    
menu 1 2    
super boutons 1    
    Fichiers testes:

DIVs Formes 4 Ronds Page 1    
DIVs Formes Lozanges 3 Diagonale 1    
DIVs Formes Lozanges 4 Bande 1    
DIVs Formes Lozanges Lozange Logo Windows 1    
DIVs Formes Lozanges Lozange Page Intro 1    
DIVs Formes Lozanges Lozange Page Intro 1 2    
DIVs Formes Lozanges Lozange Page Intro 1 3    
DIVs Formes Lozanges Lozange Page Intro 1 4    
DIVs Formes Lozanges Lozange Page Intro 1 4 Hip Hop    
Hover Super Lunnatick 1    
Menu Lozange Noir Blanc 1    
Menu horizontale boutons 1    
Paragraphe plus Texte Verticale 1    
    Quelques liens externes:

Forum Developpez.com

Forum MediaBox



Page du script de scrooling fluide

Script LightBox affichage des images en grand au clique


Coloration de la syntaxe


Divers effets en CSS

Support du web