7 replies to this topic

[fiote]

Povo,

Eu tenho um layer:

<div id="Layer1" style="position:absolute; left:242px; top:102px; width:109px; height:91px; z-index:1;">

Uma imagem:

<img  onClick="java script:move();" src="maps/rota_01/bixin.gif" width="14" height="19" border="0">

E uma função: ^^

function move() {
	document.getElementById("layer1").style.left = 20;
}

Quando você passa o mouse na imagem, o layer vai pra posição "x = 20" ...

Só que, eu queria algo assim:

document.getElementById("layer1").style.left -= 20;

Queria que a cada vez que se clicasse na figura, ele fosse um poquinho pro lado...

Como posso fazer?


(busquei sobre layer e tem 14 páginas... enquanto eu olho um por um, vou deixar o tópico aqui)

[edmais]

vc tentou:

function move() {
	document.getElementById("layer1").style.left -= 20;
}

e deu qual erro?

[fiote]

1) O movimento não é realizado.
2) aparece aquele "Erro na página" na barra de rolagem.

Mas eu não sei dizer ao certo qual é o erro.

=\

eu tentei até:

document.getElementById("layer1").style.left = document.getElementById("layer1").style.left - 20;

ou

x = document.getElementById("layer1").style.left;
document.getElementById("layer1").style.left = x - 20;

Edição feita por: fiote, 13/04/2006, 11:49.

[Andreia Regina]

Oi!

Se vc usa o Firefox, Netscape ou Opera tem, no menu ferramentas, Console do Javascript, muito útil.
Mostra o que há de errado

[fiote]

IE aqui ... =\

Alguém pode testar pra mim?

www.revengerzone.com/teste.htm

Em cima dos bixinhos tá escrito a função que eu to usando...

O da direita funfa, mas o da esquerda não.

Edição feita por: fiote, 13/04/2006, 12:05.

[edmais]

Altera tudo o que tem entre:

<script language=....></script>

para:

<script language="JavaScript" type="text/JavaScript">
function move() {
	document.getElementById('Layer1').style.left -= 20;
}

function move2() {
	document.getElementById('Layer1').style.left = 20;
}
</script>

[fiote]

Oo'

Mas é isso que tá lá fio...

(você só trocou aspas duplas por simples)


..

Resultado: mesma coisa. =\

[Mantu]

Acabei de fazer um código que talvez te ajude. Veja se te serve:

var AB_TOGGLE_DISPLAY_ON = "ab_show";
var AB_TOGGLE_DISPLAY_OFF = "ab_hide";
var IE =(navigator.appVersion.indexOf("MSIE") > - 1);
var LEFT = 0;
var TOP = 1;

function toggleDisplay(toggler, divTarget, divSubst){
	if(divTarget && toggler){
		/*Esconde a divTarget*/
		var targetClasses = divTarget.className.split(" ");
		var newClassName = "";
		var displayClassFound = false;
		for(i = 0; i < targetClasses.length; i++){
			if(!displayClassFound){
				if(targetClasses[i] == AB_TOGGLE_DISPLAY_ON){
					newClassName += AB_TOGGLE_DISPLAY_OFF;
					if(toggler.src)
						toggler.src = "img_01.jpg";
					displayClassFound = true;
				}else if(targetClasses[i] == AB_TOGGLE_DISPLAY_OFF){
					newClassName += AB_TOGGLE_DISPLAY_ON;
					if(toggler.src)
						toggler.src = "img_00.jpg";
					displayClassFound = true;
				}else
					newClassName += targetClasses[i];
			}else{
				newClassName += targetClasses[i];
			}
			
			if(i + 1 < targetClasses.length)
				newClassName += " ";
		}
		divTarget.className = newClassName;

		if(divSubst){
			var divSubstLocation = getDivLocation(divSubst);
			var divTargetLocation = getDivLocation(divTarget);
			setDivLocation(divSubst, divTargetLocation);
			setDivLocation(divTarget, divSubstLocation);
		}
		
	}
} 

function getObjRef(objId){
	var obj;
	if(IE){
		obj = eval("document.all." + objId);
	}else {
		if(window.document.getElementById != null){
			obj = window.document.getElementById(objId);
		}else if(window.document.all != null){
			obj = window.document.all(objId);
		}else if(window.document.layers != null){
			obj = document.layers[objId];
		}else{
			obj = objId;
		}
	}
	return obj;
}

function getDivLocation(obj){
	if(!obj || !obj.tagName || obj.tagName.toLowerCase() != "div")
		return null; 

	var location = new Array(2);

	location[LEFT] = obj.offsetLeft;
	location[TOP] = obj.offsetTop;
	return location;
}

function setDivLocation(obj, location){
	if(!obj || !obj.tagName || obj.tagName.toLowerCase() != "div")
		return false;
	
	if(!location || !location.length || location.length != 2)
		return false;
	
	obj.style.left = location[LEFT];
	obj.style.top = location[TOP];
	return true;
}

Aqui na minha máquina tá funfando tanto no IE quanto no FireFox 1.0.7
Qq coisa, mande outro post, ok?

Edição feita por: Mantu, 13/04/2006, 14:38.