---
title: "fungerar i IE, men inte i de övriga webbläsarna"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/91094-fungerar-i-ie-men-inte-i-de-övriga-webbläsarna"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "ampy"
published: "2003-11-23T22:33:14.000Z"
updated: "2003-11-27T20:22:30.000Z"
replies: 18
views: 462
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/91094-fungerar-i-ie-men-inte-i-de-övriga-webbläsarna"
---

# fungerar i IE, men inte i de övriga webbläsarna

## #1 — ampy, 2003-11-23T22:33Z

Har denna lilla kod:

```
<script language="JavaScript" type="text/JavaScript">
var work = true;
function showKompis(){
if(work){
kompis.style.pixelTop += 5;

	if(kompis.style.pixelTop < 200 ){
	setTimeout("showKompis("+work+")",10);
	} else {
	work = false;
	}
} else {
kompis.style.pixelTop -= 5;

	if(kompis.style.pixelTop > 0 ){
	setTimeout("showKompis("+work+")",10);
	} else {
	work = true;
	}
}
}
</script>
	

   <div id="kompis" style="position: [b]relative[/b]; overflow:hidden;">
  <span style="position: absolute; overflow:hidden; top: 0; left: 0;" onmouseover="this.style.cursor='hand';" onclick="showKompis();">test</span>
   </div>
```

Koden fungerar endast i Internet Explorer och inte i de webbläsarna jag har testat, Mozilla och Opera. 

Hur ska man skriva om koden så att den även fungerar i Mozilla och Opera?

Permalänk: https://www.webforum.nu/p/91094

## #2 — dectgap, 2003-11-23T23:02Z

Använd *document.getElementById()* för att referera till ett element.
Istället för

```
kompis.style[...]
```

skriver du

```
document.getElementById("kompis").style[...]
```

Och använd inte *pixelTop* eftersom det är IE-specifikt. Läs av *top* (*obj.style.top*) istället.

Vad är tanken när du på dina *setTimeout*\-rader skickar med ett argument till *showKompis()*, som ändå aldrig används?

Tråden hör bättre hemma i JavaScript-forumet

Permalänk: https://www.webforum.nu/p/1212763

## #3 — Web-Tor, 2003-11-24T07:20Z

**ampy »**
Det ser ut som att det är ett javascript du vill ha hjälp med.
Jag flyttar tråden från HTML-forumet.

Permalänk: https://www.webforum.nu/p/1212860

## #4 — ampy, 2003-11-24T13:02Z

Beklagar att jag postade i fel forum, även den bästa kan göra misstag.  :r 

dectgap:

Menar du så här?

```
<script language="JavaScript" type="text/JavaScript">
var work = true;
function showKompis(){
if(work){
document.getElementById("kompis").style.top += 5;

	if(document.getElementById("kompis").style.top < 200 ){
	setTimeout("showKompis("+work+")",10);
	} else {
	work = false;
	}
} else {
document.getElementById("kompis").style.top -= 5;

	if(document.getElementById("kompis").style.top > 0 ){
	setTimeout("showKompis("+work+")",10);
	} else {
	work = true;
	}
}
}
</script>
	

  	<div id="kompis" style="position: relative; overflow:hidden;">
 	<span style="position: absolute; overflow:hidden; top: 0; left: 0;" onmouseover="this.style.cursor='hand';" onclick="showKompis();">test</span>
	</div>
```

Det fungerar inget vidare bra. 
Redigerat lite i första inlägget, var fel på ett ställe.

Permalänk: https://www.webforum.nu/p/1213057

## #5 — Jesper T, 2003-11-24T13:12Z

OT:

```
<span style="position: absolute; overflow:hidden; top: 0; left: 0;cursor:hand;cursor:pointer;" onclick="showKompis();">test</span>
```

Permalänk: https://www.webforum.nu/p/1213064

## #6 — Jesper T, 2003-11-24T13:16Z

Så här kanske:

```
<script language="JavaScript" type="text/JavaScript">
var work = true;
function showKompis(){
if(work){
document.getElementById("kompis").style.top = '+5px';

	if(document.getElementById("kompis").style.top < 200 ){

	} else {
	work = false;
	}
} else {
document.getElementById("kompis").style.top = '-5px';

	if(document.getElementById("kompis").style.top > 0 ){
	} else {
	work = true;
	}
}
}
</script>
	

  	<div id="kompis" style="position: relative; overflow:hidden;">
 	<span style="position: absolute; overflow:hidden; top: 0; left: 0;cursor:hand;cursor:pointer;" onclick="showKompis();">test</span>
	</div>
```

Permalänk: https://www.webforum.nu/p/1213067

## #7 — ampy, 2003-11-24T13:18Z

Ingen skillnad tyvärr.  :l

Permalänk: https://www.webforum.nu/p/1213069

## #8 — Jesper T, 2003-11-24T13:23Z

Det blir skillnad om du tar bort overflow:hidden; i din div.

Permalänk: https://www.webforum.nu/p/1213072

## #9 — dectgap, 2003-11-24T14:56Z

Om du ändrar funktionen till följande då?

```
<script language="JavaScript" type="text/JavaScript">
var work = true;
function showKompis(){
if(work){
document.getElementById("kompis").style.top = (parseInt(document.getElementById("kompis").style.top)+5)+'px';

	if(parseInt(document.getElementById("kompis").style.top) < 200 ){

	} else {
	work = false;
	}
} else {
document.getElementById("kompis").style.top = (parseInt(document.getElementById("kompis").style.top)-5)+'px';

	if(parseInt(document.getElementById("kompis").style.top) > 0 ){
	} else {
	work = true;
	}
}
}
</script>
```

Permalänk: https://www.webforum.nu/p/1213129

## #10 — ampy, 2003-11-24T15:02Z

Ogiltigt argument på rad 5:

```
document.getElementById("kompis").style.top = (parseInt(document.getElementById("kompis").style.top)+5)+'px';
```

Permalänk: https://www.webforum.nu/p/1213132

## #11 — dectgap, 2003-11-24T15:15Z

Jag får inget sådant fel, och följande fungerar utmärkt:

```
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>

<head>
<title>xxx</title>

<script language="JavaScript" type="text/JavaScript">
var work = true;
function showKompis(){
if(work){
document.getElementById("kompis").style.top = (parseInt(document.getElementById("kompis").style.top)+5)+'px';

	if(parseInt(document.getElementById("kompis").style.top) < 200 ){

	} else {
	work = false;
	}
} else {
document.getElementById("kompis").style.top = (parseInt(document.getElementById("kompis").style.top)-5)+'px';

	if(parseInt(document.getElementById("kompis").style.top) > 0 ){
	} else {
	work = true;
	}
}
}
setInterval("showKompis()", 50);
</script>
</head>

<body>

<div id="kompis" style="position: absolute; top: 0">hej</div>

</body>

</html>
```

Permalänk: https://www.webforum.nu/p/1213148

## #12 — Jojoxx, 2003-11-24T15:19Z

Jag skulle tippa på att det var top-värdet som saknades hos ampy. Det måste vara satt för att man skall kunna läsa av det.

```
<div id="kompis" style="position:absolute; [b]top:0px;[/b]">hej</div>
```

Permalänk: https://www.webforum.nu/p/1213152

## #13 — ampy, 2003-11-24T15:22Z

Berodde på att jag inte hade skrivit ut html, head och body.

Men du verkar ha modifierat den lite:

```
<div id="kompis" style="position: absolute; top: 0">hej</div>
```

Ska vara:

```
<div id="kompis" style="position: relative; overflow:hidden;">
<span style="position: absolute; overflow: hidden; top: 0px; left: 0;cursor:hand;cursor:pointer;" onclick="showKompis();">test</span>
</div>
```

Jag vill att när man klickar på "test" så ska den åka ner 200 px. Sen när man klickar på "test" igen ska den åka upp 200 px, till ursprungsläget.

Den nedre koden fungerar inte.

Permalänk: https://www.webforum.nu/p/1213157

## #14 — dectgap, 2003-11-24T15:37Z

De *setTimeout* du skrev i första inlägget försvann någonstans på vägen. Använd "cursor: pointer" istället för "cursor: hand", så begränsar du dig inte till IE.

```
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>

<head>
<title>xxx</title>

<script language="JavaScript" type="text/JavaScript">
var work = true;
function showKompis(){
if(work){
document.getElementById("kompis").style.top = (parseInt(document.getElementById("kompis").style.top)+5)+'px';

	if(parseInt(document.getElementById("kompis").style.top) < 200 ){
		setTimeout("showKompis()", 10);
	} else {
		work = false;
	}
} else {
document.getElementById("kompis").style.top = (parseInt(document.getElementById("kompis").style.top)-5)+'px';

	if(parseInt(document.getElementById("kompis").style.top) > 0 ){
		setTimeout("showKompis()", 10);
	} else {
		work = true;
	}
}
}
</script>
</head>

<body>

<div id="kompis" style="position: absolute; top: 0; cursor: pointer" onclick="showKompis()">hej</div>

</body>

</html>
```

Permalänk: https://www.webforum.nu/p/1213170

## #15 — Jojoxx, 2003-11-24T15:40Z

Då skulle jag nog använda margin istället för att "skjuta ner" div'en. Att sedan ha ett absolut-positionerat lager i en div på det sättet verkar inte helt rätt heller. Någonting som är absolut-positionerat skall inte flytta på sig bara för att sidans innehåll ändras.

Då blir det något sånt här (fungerar även i Mozilla, har inte Opera installerat här, men det borde funka där också):¨

```
<script language="JavaScript" type="text/javascript">
var diff = 5;
function showKompis(){
	document.getElementById("kompis").style.marginTop=(parseInt(document.getElementById("kompis").style.marginTop)+diff)+"px";
	if(parseInt(document.getElementById("kompis").style.marginTop)==0||parseInt(document.getElementById("kompis").style.marginTop)==200){
		diff=-diff;
	} else {
		setTimeout("showKompis()",10);
	}
}
</script>
	

<div id="kompis" style="position:relative; overflow:hidden; margin-top:0px;">
	  <span onmouseover="this.style.cursor='hand';" onclick="showKompis();">test</span>
</div>
```

Red.
Lite sen. Syftade på Ampys första inlägg.

Permalänk: https://www.webforum.nu/p/1213174

## #16 — ampy, 2003-11-25T14:30Z

Nu fungerar denna kod i IE men inte i Mozilla:

```
<script language="JavaScript" type="text/javascript">
var diff = 5;
function showKompis(){
	document.getElementById("kompis").style.marginTop=(parseInt(document.getElementById("kompis").style.marginTop)+diff)+"px";
	if(parseInt(document.getElementById("kompis").style.marginTop)==0||parseInt(document.getElementById("kompis").style.marginTop)==200){
		diff=-diff;
	} else {
		setTimeout("showKompis()",10);
	}
}
</script>
	

<div id="kompis" style="position:relative; overflow:hidden; margin-top:0px;">
	  <span style="position: absolute; top: 100px; left: 576px; overflow:hidden;" onmouseover="this.style.cursor='hand';" onclick="showKompis();">test</span>
</div>
```

Jag vill ange positionen i span för att annars blir det inte riktigt så som jag vill ha det. Hur ska man lösa detta?

Permalänk: https://www.webforum.nu/p/1213729

## #17 — ampy, 2003-11-26T23:06Z

Ingen som vet?

Permalänk: https://www.webforum.nu/p/1214466

## #18 — Jesper T, 2003-11-27T00:19Z

Om du tar bort: overflow:hidden; i **id="kompis"** så får jag det att funka i Mozilla firebird. 
Måste overflow:hidden; vara där?

Permalänk: https://www.webforum.nu/p/1214494

## #19 — ampy, 2003-11-27T20:22Z

Ja, tyvärr måste **overflow:hidden;** vara där.

Permalänk: https://www.webforum.nu/p/1214877

---

Tråden på webben: https://www.webforum.nu/amne/javascript/91094-fungerar-i-ie-men-inte-i-de-övriga-webbläsarna