Un texte qui fait le tour de la fenêtre
Soyez le premier à donner votre avis sur cette source.
Snippet vu 5 722 fois - Téléchargée 24 fois
Contenu du snippet
Le titre est assez explicite je pense^^. Reste à ajouter qu'il n'est pas finalisé ici et que vous pouvez bien entendu reprendre et personnaliser le script à votre guise. N'hésitez pas à me proposer des améliorations si vous en voyez, mais cette page a déjà subi l'examen de bultez^^.
Source / Exemple :
<html>
<head>
<title>Création d'un site web en html et javascript</title>
<style>
#texte{
position: absolute;
top: 50px;
left: 50px;
font-size: 30px;
font-family: arial;
font-weight: bold;
}
#rouge{
position: absolute;
top: 20px;
left: 200px;
color: 'red';
}
#bleu{
position: absolute;
top: 20px;
left: 450px;
color: 'blue';
}
#vert{
position: absolute;
top: 20px;
left: 700px;
color: 'green';
}
#jaune{
position: absolute;
top: 20px;
left: 950px;
color: 'yellow';
}
</style>
<script language="Javascript">
par = 'Ce site sans theme particulier est un<br>exercice et un entraînement à la production<br>en javascript. Toutes vos idées pour son<br>développement sont les bienvenues.';
abscisse = 50;
ordonnee = 50;
compteur = 0;
car = 0;
couleur = 'red';
function changecouleur(choix){
couleur = choix;
}
function moveText(){
compteur ++;
if(compteur == 4){
compteur = 0;
if(par.charAt(car) == '<') car = car + 4;
if(par.charAt(car) == ' ') car++;
document.getElementById('texte').innerHTML = par.substring(0,car) + par.charAt(car).fontcolor(couleur) + par.substr(car + 1);
car ++;
if(car > par.length) car = 0;
}
absmax = document.body.clientWidth - document.getElementById('texte').clientWidth - 50;
ordmax = document.body.clientHeight - document.getElementById('texte').clientHeight - 50;
if(ordonnee == 50 && abscisse < absmax){
document.getElementById('texte').style.left = abscisse;
abscisse ++;
}
if(abscisse == absmax && ordonnee < ordmax){
document.getElementById('texte').style.top = ordonnee;
ordonnee ++;
}
if(ordonnee == ordmax && abscisse > 50){
document.getElementById('texte').style.left = abscisse;
abscisse --;
}
if(abscisse == 50 && ordonnee > 50){
document.getElementById('texte').style.top = ordonnee;
ordonnee --;
}
setTimeout("moveText()",20)
}
</script>
</head>
<body onload="moveText()" background="cloud.gif">
<a href="#" onclick="changecouleur('red')" id="rouge">rouge</a><a href="#" onclick="changecouleur('blue')" id="bleu">bleu</a><a href="#" onclick="changecouleur('green')" id="vert">vert</a><a href="#" onclick="changecouleur('yellow')" id="jaune">jaune</a>
<div id="texte">
Je suis un texte fenêtre-trotteur<br>
résultant de près d'une semaine<br>
de travail.
</div>
</body>
</html>
A voir également
- Un texte qui fait le tour de la fenêtre
- C / C++ / C++.NET : Tour de hanoi sous console (texte) et son avec fmod - CodeS SourceS - Guide
- Tour de hanoï python - Guide
- Vba ecrire fichier texte - Conseils pratiques - Visual Basic / VB.NET
- Convertir fichier binaire en texte - Forum - C / C++ / C++.NET
- Vba convertir nombre en texte - Forum - Visual Basic
Vous n'êtes pas encore membre ?
inscrivez-vous, c'est gratuit et ça prend moins d'une minute !
Les membres obtiennent plus de réponses que les utilisateurs anonymes.
Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.
Le fait d'être membre vous permet d'avoir des options supplémentaires.