espero me puedan ayudar con mi problema. ya que llevo buen rato intentando solucionarlo y nada .
Tengo un código javascript que sirve para crear un layer flotante y que éste te siga cuando te mueves por la web, me dejo entender? osea que cuando usas la barra de Scroll para bajar, el layer baja contigo. Sucede que el código NO funciona cuando pongo uso el doctype :
Código:
El código SI funciona cuando no declaro ningún doctype.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "hxxp://www_w3_org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
El código del problema:
Código PHP:
function closeDiv() {
document.getElementById("floatLayer").style.left = "-1000px";
return false;
}
var topMargin = 150;
var slideTime = 2500;
var ns6 = (!document.all && document.getElementById);
var ie4 = (document.all);
var ns4 = (document.layers);
function layerObject(id,left) {
if (ns6) {
this.obj = document.getElementById(id).style;
this.obj.left = left;
return this.obj;
}
else if(ie4) {
this.obj = document.all[id].style;
this.obj.left = left;
return this.obj;
}
else if(ns4) {
this.obj = document.layers[id];
this.obj.left = left;
return this.obj;
}
}
function layerSetup() {
floatLyr = new layerObject("floatLayer", pageWidth * .1);
window.setInterval("main()", 10)
}
function floatObject() {
if (ns4 || ns6) {
findHt = window.innerHeight;
} else if(ie4) {
findHt = document.body.clientHeight;
}
}
function main() {
if (ns4) {
this.currentY = document.layers["floatLayer"].top;
this.scrollTop = window.pageYOffset;
mainTrigger();
}
else if(ns6) {
this.currentY = parseInt(document.getElementById("floatLayer").style.top);
this.scrollTop = scrollY;
mainTrigger();
} else if(ie4) {
this.currentY = floatLayer.style.pixelTop;
this.scrollTop = document.body.scrollTop;
mainTrigger();
}
}
function mainTrigger() {
var newTargetY = this.scrollTop + this.topMargin;
if ( this.currentY != newTargetY ) {
if ( newTargetY != this.targetY ) {
this.targetY = newTargetY;
floatStart();
}
animator();
}
}
function floatStart() {
var now = new Date();
this.A = this.targetY - this.currentY;
this.B = Math.PI / ( 2 * this.slideTime );
this.C = now.getTime();
if (Math.abs(this.A) > this.findHt) {
this.D = this.A > 0 ? this.targetY - this.findHt : this.targetY + this.findHt;
this.A = this.A > 0 ? this.findHt : -this.findHt;
}
else {
this.D = this.currentY;
}
}
function animator() {
var now = new Date();
var newY = this.A * Math.sin( this.B * ( now.getTime() - this.C ) ) + this.D;
newY = Math.round(newY);
if (( this.A > 0 && newY > this.currentY ) || ( this.A < 0 && newY < this.currentY )) {
if ( ie4 )document.all.floatLayer.style.pixelTop = newY;
if ( ns4 )document.layers["floatLayer"].top = newY;
if ( ns6 )document.getElementById("floatLayer").style.top = newY+"px";
}
}
function start() {
if(ns6||ns4) {
pageWidth = innerWidth;
pageHeight = innerHeight;
layerSetup();
floatObject();
}
else if(ie4) {
pageWidth = document.body.clientWidth;
pageHeight = document.body.clientHeight;
layerSetup();
floatObject();
}
}
window.onload=start
El HTML:
Código HTML:
<div id="floatLayer" style="LEFT: 135px; WIDTH: 10px; height:auto;POSITION: absolute; TOP: 464px; HEIGHT: 270px; BACKGROUND-COLOR: #000000;"> <a onclick="return closeDiv()">cerrar</a> </div>
NOTA 2: Cuando digo NO FUNCIONA quiero decir que el layer no te sigue, se queda estático.