Ir para conteúdo

POWERED BY:

Arquivado

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

ScornInPC

Problemas com layout

Por , em Desenvolvimento frontend

Recommended Posts

ScornInPC    1

ScornInPC
Postado

Ola pessoal. tenho um layout que começei a brincar, que pode ser encontrado aqui http://scorninpc.php0h.com/layout/

 

vejam que no FF ele fica com uma barra a mais no menu

 

e no IE ele fica com uma separação (uma borda a mais) entre uma barra e outra.

 

ai vai o código pra que naum estiver consegindo ver.

 

<html>	<head>		<style>			BODY { 				margin: 0px;				height: 8.5in;				cursor: default;			}			#conteiner1 {				height: 100%;			}			#conteiner2 {				height: 100%;				width: 200px;				float: left; 			}			#vertical_bar {				border: 0px #999999 solid;				background-color: #999999;				height: 100%;				width: 3px;				float: left;				cursor: e-resize;			}			#horizontal_bar {				border: 0px #999999 solid;				background-color: #999999;				height: 3px;				width: auto;				font-size: 3px;				cursor: n-resize;			}			#conteiner3 {				height: 100%;				margin-left: 0px;				padding-left: 0px;				left: 0px;			}			#conteiner4 {				height: 200px;			}			#conteiner5 {				height: 350px;			}		</style>		<script language="javascript">////////////////////////////////////////////////////////////////////////////////////////////////////////////////// MOVER BARRA VERTICALMENTE  //////////////////////////////////////////////////////////////////////////////////			var vertical_bar_moving = false;						function vertical_bar_move_on() {				vertical_bar_moving = true;			}						function vertical_bar_move_off() {				vertical_bar_moving = false;			}						function vertical_bar_move() {				if(vertical_bar_moving) {					var vertical_bar_area = document.getElementById("vertical_bar");					var conteiner2_area = document.getElementById("conteiner2");					conteiner2_area.style.width = xMousePos;				}			}////////////////////////////////////////////////////////////////////////////////////////////////////////////////// MOVER BARRA HORIZONTALMENTE /////////////////////////////////////////////////////////////////////////////////			var horizontal_bar_moving = false;						function horizontal_bar_move_on() {				horizontal_bar_moving = true;			}						function horizontal_bar_move_off() {				horizontal_bar_moving = false;			}						function horizontal_bar_move() {				if(horizontal_bar_moving) {					var horizontal_bar_area = document.getElementById("horizontal_bar");					var conteiner4_area = document.getElementById("conteiner4");					conteiner4_area.style.height = yMousePos;				}			}////////////////////////////////////////////////////////////////////////////////////////////////////////////////// EVENTOS DO MOUSE ////////////////////////////////////////////////////////////////////////////////////////////			var xMousePos = 0;			var yMousePos = 0;						var isIE = document.all?true:false;			function getMouseXY(e) {				if(isIE) {					xMousePos = event.clientX + document.body.scrollLeft;					yMousePos = event.clientY + document.body.scrollTop;				} else {					xMousePos = e.pageX;					yMousePos = e.pageY;				}  				if(xMousePos < 0) {					xMousePos = 0;				}				if(yMousePos < 0) {					yMousePos = 0;				}			}			if(!isIE) {				document.captureEvents(Event.MOUSEMOVE);				document.onmousemove = documentOnMouseMove;				document.onmouseup = documentOnMouseUp;			} else {				document.onmousemove = documentOnMouseMove;				document.onmouseup = documentOnMouseUp;			}////////////////////////////////////////////////////////////////////////////////////////////////////////////////// FUNÇÕES DOCUMENT ////////////////////////////////////////////////////////////////////////////////////////////			function documentOnMouseMove(e) {				getMouseXY(e);				horizontal_bar_move();				vertical_bar_move();			}			function documentOnMouseUp(e) {				horizontal_bar_move_off();				vertical_bar_move_off();			}////////////////////////////////////////////////////////////////////////////////////////////////////////////////		</script>	</head>	<body>		<div id="conteiner1">			<div id="conteiner2">a</div>			<div id="vertical_bar" onMouseDown="vertical_bar_move_on()"></div>			<div id="conteiner3">				<div id="conteiner4">b</div>				<div id="horizontal_bar" onMouseDown="horizontal_bar_move_on()"></div>				<div id="conteiner5">c</div>			</div>		</div>	</body></html>

da pra deixar os browsers igual esta no FF mas tirando aquela barra horizontal que esta "comendo" o menu?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Fabio Morikawa    0

Fabio Morikawa
Postado

as mudancas estão com identação maior

 

#conteiner3 {				height: 100%;					margin-left: 200px;				padding-left: 0px;					_left: -3px;					position: relative;			}

Compartilhar este post

Link para o post
Compartilhar em outros sites

ScornInPC    1

ScornInPC
Postado

opa, funciona, beleza, mas naum sei pq raios, quando coloco isso no conteiner3, meu código para de funcionar.você viu o codigo rodando?da pra mover o layout certo? aqui quando coloco esse conteiner3 no lugar do meu, naum funcionar mais =/estranho neh?bom, mesmo assim agradeço, vou ver se dou um jeito de fazer funcionarobrigado

Compartilhar este post

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

Informação importante

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

  Aceito