Un joli texte défilant ......^^

Messages : 25 Date d'inscription : 19/09/2007

Créer en tant que source javascript externe (extension *.js):

Code:: /*************************************/
/*** Intégration du javascript ***/
/*************************************/

var y = 0;
var minuteur = null;
var temps = 10;

//minuteur défilement en avant du texte
function transfert()
{
minuteur=setInterval('defil()',temps);
}
//minuteur défilement en arriere du texte
function transfertBis()
{
minuteur=setInterval('retourArriere()',temps);
}
function defil()
{
document.getElementById('texteDefil').style.top = y--;
document.getElementById('compteur').value = y;
}
//Retour en arriere du texte
function retourArriere()
{
document.getElementById('texteDefil').style.top = y++;
document.getElementById('compteur').value = y;
}
//Arret défilement du texte
function arretDefil()
{
clearInterval(minuteur);
minuteur=null;
y = 0;
document.getElementById('texteDefil').style.top = y;
document.getElementById('compteur').value = y;
}
function pause()
{
clearInterval(minuteur);
}

Créer en feuille de style externe (extension *.css)

Code:: /******************************************/
/*** Intégration de la feuille de style ***/
/******************************************/

.boutons{
border :solid navy 2px;
background :#aaccff;
color :navy;
width :50;
height :25;
}
#texte{
text-align :left;
padding :10;
margin-top :50;
color :navy;
font-weight :bold;
}
#compteur{
border :solid black 1px;
width :30;
text-align :center;
}

Vous avez le choix pour l'affichage de celle-ci HTML ou PHP(*.html ou *.php):

Code:: <html>
<head>
<title>Texte Defilant</title>
<meta>
<meta>
<meta>
<meta>
<meta>
<script></script>
<link>
</head>
<body>
<div>
<a href="http://validator.w3.org/check?uri=referer" target="_blank"><img src="http://www.w3.org/Icons/valid-html401" alt="Valid HTML 4.01 Transitional" height="31" width="88" border="0">
</a>
</div>
<center>
<div id="Haut">
<table align="center" bgcolor="white">
<tr>
<td>
<form>
<input>
<input>
<input>
<input>
<b>Pos: </b>  <input>
</form>
</td>
</tr>
</table>
</div>
<table align="center">
<tr>
<td align="center">
<div id="texteDefil">
<img src="titre.gif" alt="">
<pre id="texte">';include("texte.txt");echo'</pre>
</div>
</td>
</tr>

</table>
<div id="Bas"></div>
</center>
</body>
</html>