---
title: "mouseout - tillbaka till genomskinlig bakgrund"
type: "forum-thread"
url: "https://www.webforum.nu/amne/html-css/87324-mouseout-tillbaka-till-genomskinlig-bakgrund"
topic: "HTML & CSS"
topic_url: "https://www.webforum.nu/amne/html-css"
author: "magnusfeldth"
published: "2003-09-30T19:49:11.000Z"
updated: "2003-10-01T09:19:28.000Z"
replies: 6
views: 307
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/html-css/87324-mouseout-tillbaka-till-genomskinlig-bakgrund"
---

# mouseout - tillbaka till genomskinlig bakgrund

## #1 — magnusfeldth, 2003-09-30T19:49Z

Använder denna koden i en tabell:
onMouseOver="this.style.background='#FFFFFF'" onMouseOut="this.style.background='#???'

När den hålls över skall bakgrunden ändras från genomskinlig till vit... men när man tar mouseout vill jag att den skall gå tillbaka till att vara genomskinlig... hur gör jag då?

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

## #2 — Cheguelin, 2003-09-30T20:29Z

Jag vet inte riktigt hur det fungerar men jag tror att du kan sätta bakgrunden till transparent. Annars så fungerar det att sätta background till "", i alla fall i IE. Jag har för mig att jag har upplevt förhinder med det i mozilla.

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

## #3 — Webboteket, 2003-09-30T20:35Z

Prova med "transparent"
<http://www.w3schools.com/css/pr_background-color.asp>

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

## #4 — ejick, 2003-09-30T21:07Z

kan du inte bara skriva:

```
onMouseOut="this.style.background='';"
```

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

## #5 — jarvklo, 2003-10-01T07:56Z

Hmm... Precis som Peter och Christian säger så är  "transparent" är ett korrekt färgvärde...
Och detta exempel funkar iallafall i Firebird, MSIE6 och Opera7 (de enda jag snabbt kunde testa med nu direkt ;) )

```
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
  <title>Test</title>
</head>
<body>
<table style="background:url(testbild.gif);width:200px;height:200px">
<tr><td>&amp;nbsp;</td></tr>
<tr>
  <td onMouseOver="this.style.background='#FFFFFF'" onMouseOut="this.style.background='transparent'">
      Hej hopp!
  </td>
</tr>
<tr><td>&amp;nbsp;</td></tr>
</table>
</body>
</html>
```

Koden finns också upplagd på <http://member.webforum.nu/2241/onmouseover_transparent.html>

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

## #6 — SugarDaddy, 2003-10-01T08:03Z

Sidofråga, har för mig att det varit uppe innan men hittade inget vid en snabbsökning, iaf:
kan man "förenkla" koden på något sätt och exvis slippa ange 

\<td onMouseOver="this.style.background='#FFFFFF'" onMouseOut="this.style.background='transparent'"\>
för varje enskild \<td\> och istället bara ange ngt i stil med \<td class="swapbg"\>?

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

## #7 — dectgap, 2003-10-01T09:19Z

> **SugarDaddy skrev:**
>
> Sidofråga, har för mig att det varit uppe innan men hittade inget vid en snabbsökning, iaf:
> kan man "förenkla" koden på något sätt och exvis slippa ange 
> 
> \<td onMouseOver="this.style.background='#FFFFFF'" onMouseOut="this.style.background='transparent'"\>
> för varje enskild \<td\> och istället bara ange ngt i stil med \<td class="swapbg"\>?

Det kan du göra genom att blanda in lite Java Script:

```
<script type="text/javascript">
window.onload=function(){
  var tags = document.getElementsByTagName('td');
  for(i=0; i<tags.length; i++){
    if(tags[i].className=="swapbg"){
      tags[i].onmouseover=function(){
        this.style.background="#fff";
      }
      tags[i].onmouseout=function(){
        this.style.background="transparent";
      }
    }
  }
}
</script>

...

<body style="background: #000;">

<table>
  <tr>
    <td class="swapbg">Text</td>
    <td class="swapbg">Text</td>
    <td class="swapbg">Text</td>
  </tr>
  <tr>
    <td class="swapbg">Text</td>
    <td class="swapbg">Text</td>
    <td class="swapbg">Text</td>
  </tr>
</table>

</body>
```

I Mozilla kan man strunta i skriptet och istället lösa det med CSS:

```
<style type="text/css">
.swapbg {
  background: transparent;
}

.swapbg:hover {
  background: #fff;
}
</style>
```

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

---

Tråden på webben: https://www.webforum.nu/amne/html-css/87324-mouseout-tillbaka-till-genomskinlig-bakgrund
