Ir para conteúdo

POWERED BY:

Arquivado

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

Filipe_Moraes

Layer sempre numa posição na tela

Por , em Javascript

Recommended Posts

Filipe_Moraes    15

Filipe_Moraes
Postado

Ola pessoal, queria saber se ha como eu fazer uma layer esta sempre visivel no auto da tela do browser, tipo, mesmo se eu abaixar a barra de rolagem do site, a layer continua a ser visivel no alto do browser...Agradecia a ajuda!!

Compartilhar este post

Link para o post
Compartilhar em outros sites

Otata    4

Otata
Postado

você pode fazer uma função que mude o x do elemento de acordo com a barra de rolagem....t+

Compartilhar este post

Link para o post
Compartilhar em outros sites

hunternh    2

hunternh
Postado

position.js

posicao = function(id,l,t){	var obj = this;	var o = document.getElementById(id);		jQuery(o).css({"z-index": "102",				   "position": "absolute"});		this.getPageScrollTop = function()	{		var yScrolltop;		var xScrollleft;		if (self.pageYOffset || self.pageXOffset)		{			yScrolltop = self.pageYOffset;			xScrollleft = self.pageXOffset;		}		else if(document.documentElement && document.documentElement.scrollTop || document.documentElement.scrollLeft )		{	 // Explorer 6 Strict			yScrolltop = document.documentElement.scrollTop;			xScrollleft = document.documentElement.scrollLeft;		}		else if(document.body)		{// all other Explorers			yScrolltop = document.body.scrollTop;			xScrollleft = document.body.scrollLeft;		}		arrayPageScroll = new Array(xScrollleft,yScrolltop) 		return arrayPageScroll;	};		this.position = function()	{		var arrayPageScroll = obj.getPageScrollTop();		jQuery(o).css({left: (arrayPageScroll[0] + l), top: (arrayPageScroll[1] + t) });	};		this.init = function()	{		jQuery(window).scroll(function(){obj.position();});		jQuery(window).resize(function(){obj.position();});		obj.position();	};};

Como usar (precisa da biblioteca jQuery):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"	  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br" lang="pt-br"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Posição fixa</title><script type="text/javascript" src="jquery-latest.pack.js"></script><script type="text/javascript" src="position.js"></script><script type="text/javascript">//<![CDATA[jQuery(document).ready(function(){	var flutua = new posicao("flutua",30,100);	flutua.init();});//]]></script></head><body><div><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /></div><div id="flutua">asdfasdf</div></body></html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Filipe_Moraes    15

Filipe_Moraes
Postado

e ae amigo, tudo bem? obrigado pela ajuda, mas não funcionou, coloquei os codigos tal e qual como esta ai mas não funcionou...Agradecia a ajuda!!

Compartilhar este post

Link para o post
Compartilhar em outros sites

hunternh    2

hunternh
Postado

Baixe a bilbioteca jQuery:

http://code.google.com/p/jqueryjs/download...1.1.3.1.pack.js

depois mude o nome dela para jquery-latest.pack.js

ai você precisa criar o arquivo position.js com o script js que postei acima. Testei esse código com o FF, IE6, IE7 e Opera e funcionou em todos.

 

Em funcionamento:

http://hunternh.110mb.com/exemplos/position.html

Compartilhar este post

Link para o post
Compartilhar em outros sites

Filipe_Moraes    15

Filipe_Moraes
Postado

ok, era mesmo a biblioteca que faltava, ja resolvi o problema, o que eu precisava mesmo era fazer um tipo "saiba mais", modificando o codigo e acrecentando umas linhazinhas, consegui fazer isso...Obrigado pela ajuda pessoal, agora webphlex, como seria isso em CSS??valeu!!!

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

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

  Aceito