<html>
<head>
<STYLE>
<!--Style css qui fait que les images se chevauchent -->
.textstyle {
position:absolute;
left:-2000px;
}
.bgdivstyle {
position:absolute;
left:-2000px;
}
</STYLE>
<SCRIPT>
<!--
// Url de votre image texte
var textimage="imagetexte.gif"
// Url de l'image d'arriere plan
// /!\ Elle doit avoir la même hauteur que le texte-image. /!\
var bgimage="imagefond.jpg"
// La hauteur du texte image (en pixels).
var textimageheight=206
// La largeur de l'image texte
var textimagewidth=359
// La largeur de l'image d'arrière-plan.
// Au minimum la largeur du texte-image. Plus large est souhaitable.
var bgdivwidth=1200
// Distance entre votre image et le bord supérieur de la page
var textimagetop=10
// Distance entre votre image et le bord droit de la page.
var textimageleft=10
// La vitesse de l'animation.
// Plus la valeur est petite, plus l'animation sera lente
var step=5
/////////////////////////////////////////////////////////
///////////// A partir de la pas toucher ! //////////////
/////////////////////////////////////////////////////////
var imgpreload=new Image()
imgpreload.src=textimage
var bgimgpreload=new Image()
bgimgpreload.src=bgimage
var bgdivtop=textimagetop
var bgdivleft=textimageleft
var bgdivheight=textimageheight
var cliptop=0
var clipright=textimagewidth
var clipbottom=bgdivheight
var clipleft=0
var clippoints
var contentbg=""
var pause=50
var timer
function init() {
clipleft=0
clipright=textimagewidth
contentbg="<table cellpadding=0 cellspacing=0 border=0><tr>"
contentbg+="<td><img src='"+bgimage+"' border='0' width='"+bgdivwidth+"' height='"+textimageheight+"'></td>"
contentbg+="<td><img src='"+bgimage+"' border='0' width='"+bgdivwidth+"' height='"+textimageheight+"'></td>"
contentbg+="<td><img src='"+bgimage+"' border='0' width='"+bgdivwidth+"' height='"+textimageheight+"'></td>"
contentbg+="</tr></table>"
if (document.all) {
bgdiv.innerHTML=contentbg
text.innerHTML="<img src='"+textimage+"' border='0' width='"+textimagewidth+"' height='"+textimageheight+"'>"
document.all.text.style.posTop=textimagetop
document.all.text.style.posLeft=textimageleft
document.all.bgdiv.style.posTop=bgdivtop
document.all.bgdiv.style.posLeft=bgdivleft
movebackground()
}
if (document.layers) {
document.bgdiv.document.write(contentbg)
document.bgdiv.document.close()
document.text.document.write("<img src='"+textimage+"' border='0' width='"+textimagewidth+"' height='"+textimageheight+"'>")
document.text.document.close()
document.text.top=textimagetop
document.text.left=textimageleft
document.bgdiv.top=bgdivtop
document.bgdiv.left=bgdivleft
movebackground()
}
}
function restart() {
clipleft=0
clipright=textimagewidth
if (document.all) {
document.all.bgdiv.style.posLeft=bgdivleft
}
if (document.layers) {
document.bgdiv.left=bgdivleft
}
movebackground()
}
function movebackground() {
if (document.all) {
if (document.all.bgdiv.style.posLeft >=(-bgdivwidth+textimagewidth+bgdivleft+step)) {
clipleft+=step
clipright=clipleft+textimagewidth
clippoints="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
document.all.bgdiv.style.clip=clippoints
document.all.bgdiv.style.posLeft-=step
timer= setTimeout("movebackground()",pause)
}
else {
clearTimeout(timer)
text.innerHTML="<img src='"+textimage+"' border=0>"
restart()
}
}
if (document.layers) {
if (document.bgdiv.left >=(-bgdivwidth+textimagewidth+bgdivleft+step-22)) {
clipleft+=step
clipright=clipleft+textimagewidth
document.bgdiv.clip.top=cliptop
document.bgdiv.clip.left=clipleft
document.bgdiv.clip.bottom=clipbottom
document.bgdiv.clip.right=clipright
document.bgdiv.left-=step
timer= setTimeout("movebackground()",pause)
}
else {
clearTimeout(timer)
document.text.document.write("<img src='"+textimage+"' border=0>")
document.text.document.close()
restart()
}
}
}
// -->
</SCRIPT>
<title>Un texte avec un arrière plan défilant !</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" text="#000000" onLoad="init()">
<DIV ID="bgdiv" class="bgdivstyle"></DIV>
<DIV ID="text" class="textstyle"></DIV>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p><font face="Verdana, Arial, Helvetica, sans-serif" size="2">Pour pour faire
l'image du dessus (l'image du texte) il vous suffit avec nimporte quel logiciel
de retouche de photos de prendre une image vierge blanche et d'inscrire votre
texte à la gomme dessus.</font></p>
</body>
</html>