Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Rhamses

Problema com código de Div Flutuante

Recommended Posts

Olá Pessoal bom dia,

 

Ontem eu estava pesquisando um jeito de fazer uma div acompanhar a rolagem da tela, entao coloquei por css a regra "fixed", mas acontece que o cliente não gostou, ele quer algo mais animado mais leve, entao procurei um jeito de fazer por javascript, mas como eu não conheço muito da linguagem, procurei por fóruns pela google e achei o que eu queria.

Então Adaptei no meu site, e testei. No mozilla, tudo certo, parecia que eu tinha conseguido, então fui testar no iE =/. Ele simplesmente ignora o javascript, dei uma revisada no código mas não encontrei nada estranho (lembrando que eu não conheço muito da linguagem), e o grande problema é que não estou coneguindo achar um outro tutorial ou código para substituir o que eu tenho.

Alguém poderia me ajudar a resolver isso, ou seja deixar funcionando o código que eu tenho aqui mesmo??

 

O site onde eu encontrei o código que me deu o problema

 

Desde já agradeço aí pessoal!

 

Obrigado

Compartilhar este post


Link para o post
Compartilhar em outros sites

Poste o SEU código adaptado... e se possivel um link para a sua aplicação..

 

Abraços...

Compartilhar este post


Link para o post
Compartilhar em outros sites

Poste o SEU código adaptado... e se possivel um link para a sua aplicação..

 

Abraços...

aqui tá o código do html da div.

 

<DIV id="master" style="Z-INDEX: 2; LEFT: 340px; VISIBILITY: visible; WIDTH: 200px; POSITION: absolute; TOP: 200px">
	<DIV id="divflutuante" style="Z-INDEX: 5; LEFT: 257px; VISIBILITY: visible; WIDTH: 148px; POSITION: absolute; TOP: 93px">
		<TABLE cellSpacing=0 cellPadding=0 border="0" style="width: 161px; height: 103px;" background="imagem/carrinho/fundo2.png">
		 <TBODY>
			  <TR>
				<TD width="100%" class="verdana10npreto" style="height: 21px" align="center">
					<asp:Label ID="lblTit2" runat="server" CssClass="verdana12nbranco"></asp:Label></TD>
			</TR>
			  <TR>
				<TD vAlign=middle width="100%" align="center"><table style="width: 138px; height: 1px;" cellpadding="0" cellspacing="0">
					<tr>
						<td class="verdana10npreto" align="left" style="width: 27px">
							Total:</td>
					</tr>
					<tr>
						<td align="left" class="verdana10npreto">
							<asp:Label ID="lblTotal2" runat="server" CssClass="verdana12nlaranja"></asp:Label></td>
					</tr>
				</table>
					<A onfocus=this.blur() href="#"></A></TD>
			</TR>
			 <tr>
				 <td valign="top" width="100%" style="height: 12px" align="center">
					 <asp:Image ID="Image4" runat="server" ImageAlign="AbsBottom" ImageUrl="imagem/carrinho/ico_carrinho.gif" />
					 <asp:LinkButton ID="LinkButton1" runat="server">Adicionar ao carrinho</asp:LinkButton></td>
			 </tr>
		 </TBODY>
		 </TABLE>
	 </DIV>
 </DIV>

Pelo que eu entendi é uma div master que abriga a div que vai ser a flutuante. A pessoa original que fez esse código e que largo o projeto no meio nao devia conhecer muito css rsrs.....

vou passar o link do problema, nao é o do projeto inteiro ou mesmo o original por que é impossivel montar a estrutura do servidor agora, entao é somente a pagina com o problema acredito que isso nao mude nada na avaliação.

 

Essa é a página onde esta o menu flutuante

 

da para perceber que somente o iE desconhece o codigo, no mozilla roda tranquilamente.

Como resolver isso?

 

espero resposta

 

obrigado novamente

Compartilhar este post


Link para o post
Compartilhar em outros sites

O problema do IE está nesta linha

this.obj = document.all[id].style;

Dentro do seu arquivo .Js

 

Abraços...

Compartilhar este post


Link para o post
Compartilhar em outros sites

O problema do IE está nesta linha

this.obj = document.all[id].style;

Dentro do seu arquivo .Js

 

Abraços...

Desculpa cara, mas eu não entendi direito. O problema está la ok? bom, eu comentei a linha, e copiei o valor da linha de cima na linha com problema só que o resultado é o mesmo.

É preciso modificar ou comentar essa linha?

 

obrigado de novo

Compartilhar este post


Link para o post
Compartilhar em outros sites

Caso você nao tenha percebido.... falta um "." ( ponto final ) nesta linha

 

this.obj = document.all.[id].style;

Compartilhar este post


Link para o post
Compartilhar em outros sites

Caso você nao tenha percebido.... falta um "." ( ponto final ) nesta linha

 

this.obj = document.all.[id].style;

Entao cara, como eu disse antes não tenho muito conhecimento da linguagem e creio que esta tudo certo naquela linha (não sei eu não vi nada de errado) vou postar aqui o código por que o "." que voce me disse que estava faltanto deve estar sobrando mas mesmo assim não consegui fazer rodar no iE6.

o código seguinte é o que esta na pagina original do projeto, é ele que esta fazendo funcionar no mozilla e esta sendo ignorado no iE. espero que isso ajude melhor. Se o erro for mesmo nessa linha, você poderia me explicar por favor por que isso acontece?

 

obrigado novamente.

 

<!--
 Microsoft = (document.all)? true:false
		function CalcularPosicao(){
			if(Microsoft){
				LarguraSite=760;
				document.body.onresize = function(){start();}
				document.body.onload = function(){start();}
				windowwidth = document.body.clientWidth;
				EspacoLivre=document.body.clientWidth-LarguraSite;
				posicaoCamada = EspacoLivre/2;
				Altura=screen.availHeight;
				Largura=screen.availWidth;
			}
			else{
				LarguraSite=780;
				window.onresize = function(){start();}
				window.onload = function(){start();}
				windowwidth = window.innerWidth;
				EspacoLivre=window.innerWidth-LarguraSite;
				posicaoCamada = EspacoLivre/2;
				Altura=window.innerHeight;
				Largura=screen.availWidth;
			}
		}
		
		
		var ns6 = (!document.all && document.getElementById);
		var ie4 = (document.all);
		var ns4 = (document.layers);
		
		function getValuesByBrowser() {
			if (ns6) {
				this.vobj = new Object();
				this.vobj.topMargin = 150;
				this.vobj.slideTime = 1500;
				return this.vobj;
			} else if(ie4) {
				this.vobj = new Object();
				this.vobj.topMargin = 100;
				this.vobj.slideTime = 1500;
				return this.vobj;
			} else if(ns4) {
				this.vobj = new Object();
				this.vobj.topMargin = 150;
				this.vobj.slideTime = 1500;
				return this.vobj;
		   }
		}
		
		window.onerror = null;
		var topMargin = getValuesByBrowser().topMargin;
		var slideTime = getValuesByBrowser().slideTime;
		
		function layerObject(id,left) {
			if (ns6) {
				this.obj = document.getElementById(id).style;
				this.obj.left = 200;
				this.obj.width = 163;
				return this.obj;
			}   else if(ie4) {
				this.obj = document.all[id].style;
				//alert("passo por aqui");
				this.obj.left = 400;
				this.obj.width = 169;
				return this.obj;
			}   else if(ns4) {
				this.obj = document.layers[id];
				this.obj.left = 200;
				this.obj.width = 163;
				return this.obj;
		   }
		}
		function layerSetup() {
			floatLyr = new layerObject('divflutuante', posicaoCamada);
			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["divflutuante"].top;
				this.scrollTop = window.pageYOffset;
				mainTrigger();
			}
			else if(ns6) {
				this.currentY = parseInt(document.getElementById('divflutuante').style.top);
				this.scrollTop = scrollY;
				mainTrigger();
			} else if(ie4) {
				this.currentY = divflutuante.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.divflutuante.style.pixelTop = newY;
				if ( ns4 )document.layers["divflutuante"].top = newY;
				if ( ns6 )document.getElementById('divflutuante').style.top = newY + "px";
			 }
		}
		function start() {
			CalcularPosicao();
			if(ns6||ns4) {
				pageWidth = innerWidth;
				pageHeight = innerHeight;
				layerSetup();
				floatObject();
			}
			else if(ie4) {
				pageWidth = document.body.clientWidth;
				pageHeight = document.body.clientHeight;
				layerSetup();
				floatObject();
		   }
		}
		start();
//-->

Compartilhar este post


Link para o post
Compartilhar em outros sites

Entao darkdemo....

agora eu descobri o que voce quis dizer com o "." ponto final. Analisei linha a linha e e realmente eu vi que estava sem um ponto mesmo.

Entretanto se era pra funcionar nos dois navegadores, surtiu efeito errado. Agora nem o mozilla nem o iE reconhecem o código, então quando retirei o ponto que estava aprincipio faltando, no mozilla volto a funcionar e no iE continua a mesma situação.

será que esse código nao e furado nao??

o cara que fez o tutorial nao me respondeu os emails. Qual um outro site bom que eu poderia pegar esse código?

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.