Non risco a capire perchè questo script non funziona in una pagina XHTML 1.0 Transitional, mentre in una pagina html non validata va!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento senza titolo</title>
</head>
<body>
<script type="text/javascript" src="defilementH.js"></script>
<div align="justify">
<script type="text/javascript">
//<![CDATA[
<!--
var isStop=false;
var msg = '<span>Voici ... c\'est un Lien vers google. Clique moi !!</span>';
var c = new scrollerObjH('c','2','300','30','300',msg,'fff3dc' ,'fff3dc','1','25',0.1);
function manageAnim()
{
if (c) {
if (isStop==false) {
isStop=true;
c.stopAnim();
objBtn = document.getElementById("btn");
objBtn.value = "Start";
} else {
isStop=false;
c.startAnim();
objBtn = document.getElementById("btn");
objBtn.value = "Stop";
}//fin if
}//fin if
}//fin manageAnim
//-->
//]]>
</script>
</div>
</body>
</html>
Il contenuto del file defilementH.js è questo:
//<![CDATA[
<!--
function scrollerObjH(name,initH,initW,heightB,widthB,conte nt,initBg,Bg,speed,timerSpeed,delta){
//====================================//
// Attributs //
//====================================//
this.name=name;
this.initH=initH;
this.initW=initW;
this.heightB=heightB;
this.widthB=widthB;
this.content=content;
this.widthText=this.content.length+10;
this.initBg=initBg;
this.Bg=Bg;
this.speed=parseInt(speed) || 1;
this.timerSpeed=parseInt(timerSpeed) || 25;
this.timer=name + "Timer";
this.elem; //1er bandeau
this.elemBuff; //2eme bandeau
this.delta=delta;
this.offsetDiv=(60 * this.delta);
this.isD1=true;//c'est le 1er bandeau qui commence
this.isD2=false;
this.cptD1=0;
this.cptD2=0;
//====================================//
// Declaration Methods //
//====================================//
this.getElement=getElement;
this.createLayer=createLayer;
//Affectation de la fonction dont le Timer
//va se servir
if (this.delta > 0 && this.delta < 1)
{
this.scrollLayer = scrollLayerPlus;
} else {
this.scrollLayer = scrollLayer;
}
//
this.stopAnim=stopAnim;
this.startAnim=startAnim;
this.scrollLoop=scrollLoop;
//====================================//
// Initialise l'objet //
//====================================//
this.createLayer();
this.getElement();
this.scrollLayer();
}//fin scrollerObjH
//================================================== =====================================//
// Definition Methods //
//================================================== =====================================//
/*
* Permet d'interagir avec la vitesse du scrolling.
*
* param int s vitesse du message scrollé.
* Remarque : s = 0 stop le scrolling
*/
function scrollLoop(s){
this.speed = s;
}//fin scrollLoop
//================================================== =====================================
/*
* Le mecanisme du scrolling par défaut.
*
*/
function scrollLayer(){
var D1Left = parseInt(this.elem.style.left);
if(D1Left > this.elem.offsetWidth*(-1)){
this.elem.style.left = D1Left - this.speed;
}else {
this.elem.style.left = this.initW;
}//fin if
}//fin scrollLayer
//================================================== =====================================
/*
* Le scroller ++
*
* On fait en sorte que le 2ème bandeau message puisse commencer à défiler alors
* que le 1er bandeau message n'est pas encore arrivé à sa fin.
* De plus, le début du 2ème message s'ajuste par rapport à un delta exprimé en pourcentage.
* Ce pourcentage correspond à la postion en partant de la fin du bandeau.
*/
function scrollLayerPlus(){
var D1Left = parseInt(this.elem.style.left);
var D2Left = parseInt(this.elemBuff.style.left);
var diff = this.elem.offsetWidth * this.delta; //le delta pour le 1er bandeau
var diff2 = this.elemBuff.offsetWidth * this.delta; //le delta pour le 2eme bandeau
////////////////////////////////////////////////////
// Controle le si le delta est atteint
//
if( D1Left - diff < this.elem.offsetWidth*(-1)) this.isD2 = true;
if( D2Left - diff2 < this.elemBuff.offsetWidth*(-1)) this.isD1 = true;
//fin controle delta/////////////////////////////////
////////////////////////////////////////////////////
// Activation du Bandeau D1
//
// Si le bandeau D1 est arrivé à la fin et que le delta soit atteint
if( (D1Left > this.elem.offsetWidth*(-1)) && this.isD1){
//Si D2 est actif, on ne fait pas bouger D1 sinon il bougerait 2 fois
//donc il irait plus vite
if (this.isD2)
{
this.cptD2++;
//Au départ de l'affichage de D2, on le positionne
//proportionnellement à D1 en fonction de delta (en %)
if (this.cptD2 == 1)
this.elemBuff.style.left = D2Left - this.speed + this.offsetDiv;
else
this.elemBuff.style.left = D2Left - this.speed;
}else {
//on attend que D2 soit fini pour que le relais de D1 se fasse ici
this.cptD1++;
this.elem.style.left = D1Left - this.speed;
}
}else {
this.cptD1 = 0;
this.isD1 = false;
this.elem.style.left = this.initW;
}//fin if
////////////////////////////////////////////////////
// Activation du Bandeau D2
//
// Si le bandeau D2 est arrivé à la fin et que le delta soit atteint
if ((D2Left > this.elemBuff.offsetWidth*(-1)) && this.isD2) {
//Si D1 est actif, on ne fait pas bouger D2 sinon il bougerait 2 fois
//donc il irait plus vite
if (this.isD1)
{
this.cptD1++;
//Au départ de l'affichage de D1, on le positionne
//proportionnellement à D2 en fonction de delta (en %)
if (this.cptD1 == 1)
this.elem.style.left = D1Left - this.speed + this.offsetDiv;
else
this.elem.style.left = D1Left - this.speed;
}else {
//on attend que D1 soit fini pour que le relais de D2 se fasse ici
this.cptD2++;
this.elemBuff.style.left = D2Left - this.speed;
}
} else {
this.cptD2 = 0;
this.isD2 = false;
this.elemBuff.style.left = this.initW;
}//fin if
}//fin scrollLayerPlus
//================================================== =====================================
/*
* Recuperation du DIV (le bandeau)
*
*/
function getElement() {
if(document.getElementById){
this.elem = document.getElementById(this.name);
this.elemBuff= document.getElementById('buff'+this.name);
} else if (document.all){
this.elem = document.all[name];
this.elemBuff= document.all['buff'+name];
} else if (document.layers){
this.elem = document.layers[name];
this.elemBuff= document.layers['buff'+name];
}//fin if
}//fin getElement
//================================================== =====================================
/*
* Création du scroller ou du bandeau
*
*/
function createLayer(){
if(document.getElementById || document.all){
//conteneur
document.write('<div id="layer'+this.name+'" style="position:relative;overflow:hidden;backgroun d-color:#'+this.initBg+';border:1px solid black;width:'+this.widthB+'px;height:'+this.height B+'px;" onMouseover="'+this.name+'.scrollLoop(0)" onMouseout="'+this.name+'.scrollLoop('+this.speed+ ')">');
//1er bandeau de message
document.write('<div id="'+this.name+'" style="position:absolute;top:'+this.initH+'px;left :'+this.initW+'px;border:0px solid black;white-space:nowrap;height:'+this.heightB+'px;background-color:#'+this.Bg+'">');
document.write(this.content);
document.write('<\/div>');
//2eme bandeau de message
document.write('<div id="buff'+this.name+'" style="position:absolute;top:'+this.initH+'px;left :'+this.initW+'px;border:0px solid black;white-space:nowrap;height:'+this.heightB+'px;background-color:#'+this.Bg+'">');
document.write(this.content);
document.write('<\/div><\/div>');
} else if(document.layers){
document.write('<ilayer name="'+this.name+'" bgcolor="#'+this.Bg+'" width="'+this.widthB+'" height="'+this.heightB+'">'+this.content+'<\/ilayer>');
document.write('<ilayer name="buff'+this.name+'" bgcolor="#'+this.Bg+'" width="'+this.widthB+'" height="'+this.heightB+'">'+this.content+'<\/ilayer>');
return;
}//fin if
//mise en route du Timer
this.startAnim();
}//fin createLayer
//================================================== =====================================
/*
* Stop le Timer
*
*/
function stopAnim(){
if(this.scrollLayer) window.clearInterval(this.timer);
}//fin stopAnim
function startAnim() {
if (this.scrollLayer) this.timer = setInterval(this.name+'.scrollLayer()',this.timerS peed);
}//fin startAnim
//-->
//]]>