---
title: "mouseover med fördröjning?"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/148268-mouseover-med-fördröjning"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "bossse"
published: "2006-06-20T21:25:44.000Z"
updated: "2006-06-21T09:54:53.000Z"
replies: 6
views: 488
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/148268-mouseover-med-fördröjning"
---

# mouseover med fördröjning?

## #1 — bossse, 2006-06-20T21:25Z

Hur får man en fördröjning av den röda färgen på c:a 0,3 sekunder vid onmouseover i mitt exempel?

```
<HTML> 
<HEAD> 
<style type="text/css">
a {cursor:hand; color:red;}
div {width:12px; height:12px;line-height:0.2em;border:1px solid black;} 
</style> 
</HEAD> 
<BODY> 
<div onMouseOver="this.style.backgroundColor= 'red';" onClick="this.style.backgroundColor='blue';"></div>
<br>
<div onMouseOver="this.style.backgroundColor= 'red';" onClick="this.style.backgroundColor='blue';"></div>
</BODY> 
</HTML>
```

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

## #2 — nitro2k01, 2006-06-20T21:56Z

Enkel variant:

```
<html>
<head>
<style type="text/css">
a {cursor:hand; color:red;}
div {width:12px; height:12px;line-height:0.2em;border:1px solid black;}
</style>
</head>
<body>
<div onmouseover="var th=this; setTimeout(function(){th.style.backgroundColor= 'red';}, 300);" onclick="this.style.backgroundColor='blue';"></div>
<br>
<div onmouseover="var th=this; setTimeout(function(){th.style.backgroundColor= 'red';}, 300);" onclick="this.style.backgroundColor='blue';"></div>
</body>
</html>
```

/r Blev fel där...

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

## #3 — bossse, 2006-06-20T22:01Z

Nä, funkar tyvärr ej!

Funkar inte! onclick för den blå funkar fortfarande.

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

## #4 — nitro2k01, 2006-06-20T22:30Z

Så vad vill du åstadkomma egentligen? Ska det bara gå att klicka på rutan när man inte håller musen över den? (?) 
Eller vill du att rutan inte ska bli blå när man klickar på den??

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

## #5 — nitro2k01, 2006-06-20T22:32Z

```

<html>
<head>
<style type="text/css">
a {cursor:hand; color:red;}
div {width:12px; height:12px;line-height:0.2em;border:1px solid black;}
</style>
</head>
<body>
<div onmouseover="var th=this; setTimeout(function(){th.style.backgroundColor= 'red';}, 300);" ></div>
<br>
<div onmouseover="var th=this; setTimeout(function(){th.style.backgroundColor= 'red';}, 300);" ></div>
</body>
</html>
```

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

## #6 — bossse, 2006-06-21T04:43Z

Rättelse

Tack nitro2k01, nu funkar det, men tyvärr så ställde jag frågan lite felaktigt.
Om jag sveper över någon eller båda rutorna lite snabbt, t.ex mindre än 0,3 sekunder så ska aldrig onmouseover aktiveras.
Den ska bara aktiveras om jag har pekaren över rutan några tiondels sekund.

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

## #7 — nitro2k01, 2006-06-21T09:54Z

Nu kanske det börja arta sig?

```
<html>
<head>
<style type="text/css">
a {cursor:hand; color:red;}
div {width:12px; height:12px;line-height:0.2em;border:1px solid black;}
</style>
</head>
<body>
<div onmouseover="var th=this; this.timeout=setTimeout(function(){th.style.backgroundColor= 'red';}, 300);"
onmouseout="clearTimeout(this.timeout); this.style.backgroundColor= 'white';"
onclick="clearTimeout(this.timeout); this.style.backgroundColor='blue';"></div>
<br>
<div onmouseover="var th=this; this.timeout=setTimeout(function(){th.style.backgroundColor= 'red';}, 300);"
onmouseout="clearTimeout(this.timeout); this.style.backgroundColor= 'white';"
onclick="clearTimeout(this.timeout); this.style.backgroundColor='blue';"></div>
</body>
</html>
```

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

---

Tråden på webben: https://www.webforum.nu/amne/javascript/148268-mouseover-med-fördröjning
