---
title: "Onmouseover"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/174415-onmouseover"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "stattin"
published: "2008-09-29T16:44:59.000Z"
updated: "2008-10-10T10:28:30.000Z"
replies: 6
views: 613
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/174415-onmouseover"
---

# Onmouseover

## #1 — stattin, 2008-09-29T16:44Z

Hallå där!

Är det någon som har en snabb och bra lösning på följande? Jag vill att exempelvis en cell eller div skall markeras med en färg när man drar musen över och naturligtvis försvinna när man tar bort pekaren. Man jag vill även att man ska kunna klicka för att behålla färgen i cellen samt klicka en gång till för att få bort färgen och då gäller det att att inte mouseover och out körs.

Förstå?

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

## #2 — Peter S, 2008-09-29T16:49Z

Har'u någon HTML-kod att utgå ifrån?

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

## #3 — stattin, 2008-09-29T19:17Z

Nja.. känns väl som det viktiga är hur själva funktionen eller funktionerna man kallar för ändamålet ska se ut, html koden kan väl i stort sett se ut hur som helst.

Eller?

```

<table width="100%" border="0" cellspacing="0" cellpadding="2">
  <tr>
    <td colspan="2">Grupp</td>
  </tr>
  <tr id="res" onmouseover="hl(1);" onmouseout="hl(0);" onclick="hl(3)">
    <td>Cell som ska markeras</td>
    <td>plus denna </td>
  </tr>
</table>
```

nått åt det hållet kanske.

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

## #4 — überfuzz, 2008-09-29T20:36Z

Brukar du använda serverskript? Om det är vid klick som förändringen ska ske kan du lika gärna ändra mha tex php.

```
<a href="?color=1">byt färg</a>
```

```php
if($_GET['color'] == 1)
{
   echo "background:#f00;";
}
```

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

## #5 — stattin, 2008-09-30T18:42Z

Tack för PHP förslaget men jag vill nog använda mig av JS i detta fall.

Jag fick följande att funka i IE men inte FX.

```
<table width="100%" border="0">
  <tr id="res"  onmouseover="hl(this.id, '#f3f3f3');" onmouseout="hl(this.id, '');" onclick="hlf(this.id);">
    <td>JAHO</td>
  </tr>
</table>
```

```

<script>

function hlf(id) {

	obj = document.getElementById(id)

	obj.style.backgroundColor = ( obj.style.backgroundColor == '#f3f3f3' ) ? '#c2c287' : '#f3f3f3';

}

function hl(id, color) {

	obj = document.getElementById(id)

		if(obj.style.backgroundColor != '#c2c287')

			{ obj.style.backgroundColor = color }

}

</script>
```

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

## #6 — bossse, 2008-10-09T15:42Z

Vet inte om detta kan hjälpa dig!

```
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<title>Test</title>
<head>
<style type=text/css>
div {width:200px; height:100px; border:1px solid black}
</style>
</head>
<BODY>
<div onmouseover="this.style.backgroundColor='blue';" onmouseout="this.style.backgroundColor='red';" onclick="this.style.backgroundColor='red';">
JAHO
</div>
</BODY>
</HTML>
```

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

## #7 — stattin, 2008-10-10T10:28Z

Tack Bosse men det blir inte riktigt rätt det där, jag har redan löst problemet och här är en variant.

Denna använder INTE jag då jag har flera divar eller celler som genereras med ett JavaScript, alla måste då ha varsin unik av och på "knapp", men grundtanken är densamma enligt följande:

```

  <div id="res"  onmouseover="hl(this.id, '#f3f3f3');" onmouseout="hl(this.id, '');" onclick="hlf(this.id);">
    JAHO
  </div>

<script language="javascript">

s = "0"

function hlf(id) {

	obj = document.getElementById(id)

	obj.style.backgroundColor = ( obj.style.backgroundColor == '#f3f3f3' ) ? '#c2c287' : '#f3f3f3';
	s = ( s == '0' ) ? '1' : '0';

}

function hl(id, color) {

	obj = document.getElementById(id)

		if(s == '0')

			{ obj.style.backgroundColor = color }

}

</script>
```

Om någon har en vettigare lösning så varsegod.

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

---

Tråden på webben: https://www.webforum.nu/amne/javascript/174415-onmouseover
