Voici quelques lignes de code qui peuvent avoir leur petit effet : donnez l’heure sur son site WebAcappella Responsive

On a pas chronométré, mais vous ne devriez pas mettre plus de 2 minutes pour afficher l’heure sur votre site.

 

Ce tutoriel viens en compléter un autre, après avoir indiqué la date, vous pouvez maintenant donner l’heure, ça peut toujours servir !

Commencez par ajouter un “élément html” et placez le code suivant :

<div style="position:floated; text-align:center;">
<a style="font-family:'quicksand';font-size:22px;font-weight:normal; color:#000000" 
<p id="heure"></p>
		<script type="text/javascript">	
		function heure() {
		
		var date = new Date();
				
		var heures = date.getHours();
		var minutes = date.getMinutes();
		var secondes = date.getSeconds();
		
		if (heures < 10){
			heures = "0" + heures;
		}
		
		if (minutes < 10){
			minutes = "0" + minutes;
		}
		
		if (secondes < 10){
			secondes = "0" + secondes;
		}

		document.getElementById('heure').innerHTML = "Il est très exactement " + heures + ":" + minutes + ":" + secondes;

		setTimeout("heure()", 1000);
		}
		
		heure();
	</script> </font>
</div>

 

Vous pouvez bien sur apporter quelques petites modifications pour personnaliser ce code. Bon, on donne l’heure hein ! Vous attendez pas à un truc complétement ouf non plus !

Ligne 1

position:floated par défaut l’élément est placé à un endroit sur votre site et il y reste.

position:fixed si vous souhaitez que l’élément reste fixe même si vous faites défiler la page, cela peut être utile si vous utilisez un menu fixe comme celui ci, ou celui ci,.

text-align:center pour avoir le texte centré (oui c’était pas bien compliqué ça !)

text-align:right pour avoir le texte à droite

texte-align:left oui vous êtes des génies ! Pour avoir le texte à gauche

 

Ligne 2

font-family: quicksand vous pouvez remplacer quicksand par une autre police “classique”

font-size:22px c’est la taille du texte

font-weight c’est l’épaisseur du texte, voici toutes les possibilités qui s’offrent : bold | bolder | lighter | normal | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900

color:#ffffff ça veut dire couleur en américain

 

Ligne 25

Vous pouvez modifier la petite phrase et également les séparateurs des chiffres.

 

Voila voila, c’est terminé, à présent, l’heure s’affiche sur votre site et évidemment se met à jour toute seule !

Bisous.