---
title: "onMouseOver fråga"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/143662-onmouseover-fråga"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "wborg"
published: "2006-03-08T23:03:31.000Z"
updated: "2006-03-09T01:05:30.000Z"
replies: 2
views: 333
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/143662-onmouseover-fråga"
---

# onMouseOver fråga

## #1 — wborg, 2006-03-08T23:03Z

Hej,

jag undrar om det är möjligt att med onMouseOver "markera" en hel kolumn (dvs från top till botten i tabellen)
precis som man kan göra med en hel rad på följande sätt:

```
<tr onMouseOver="this.style.backgroundColor='#DEEBF3';" onMouseOut="this.style.backgroundColor='';" bgcolor="#EEEEEE">
```

skulle man skriva likadant i en td så skulle det ju bara bli den cellen som
blev "markerad". Det jag vill är att när man är onMouseOver i rubrikraden i tabellen så ska den "markera" HELA kolumnen,
är man däremot onMouseOver i någon annan
rad så ska raden "markeras" hoppas ni förstår hur jag menar :D

Nu undrar jag då förstås om någon vet om det går och isåfall hur?

Tacksam för all hjälp jag kan få
/S

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

## #2 — Csson, 2006-03-09T00:35Z

```
function on_cell(direction, that) {
    
    var tag = direction == 'column' ?    'td'
            :                            'tr'
            ;
    
    var alltags = document.getElementsByTagName(tag);
    
    for(var i = 0; i < alltags.length; i++) {
                
        if(direction == 'column' && alltags.item(i).className == that.className) {
            alltags.item(i).style.backgroundColor = 'rgb(240, 240, 200)';
        }
        else if(direction == 'row' && alltags.item(i).className == that.className) {
            alltags.item(i).style.backgroundColor = 'rgb(240, 240, 200)';
        }
    }
}
function out_cell(direction, that) {
    
    var tag = direction == 'column' ?    'td'
            :                            'tr'
            ;
    
    var alltags = document.getElementsByTagName(tag);
    
    for(var i = 0; i < alltags.length; i++) {
                
        if(direction == 'column' && alltags.item(i).className == that.className) {
            alltags.item(i).style.backgroundColor = '';
        }
        else if(direction == 'row' && alltags.item(i).className == that.className) {
            alltags.item(i).style.backgroundColor = '';
        }
    }
}
```

 

```
<table>
    <tr>
        <th class="col_1" onmouseover="on_cell('column', this);" onmouseout="out_cell('column', this);">Rubrik</th>
        <th class="col_2" onmouseover="on_cell('column', this);" onmouseout="out_cell('column', this);">Rubrik</th>
        <th class="col_3" onmouseover="on_cell('column', this);" onmouseout="out_cell('column', this);">Rubrik</th>
    </tr>
    <tr class="row_1" onmouseover="on_cell('row', this);" onmouseout="out_cell('row', this);">
        <td class="col_1">Test</td>
        <td class="col_2">Test</td>
        <td class="col_3">Test</td>
    </tr>
    <tr class="row_2" onmouseover="on_cell('row', this);" onmouseout="out_cell('row', this);">
        <td class="col_1">Test</td>
        <td class="col_2">Test</td>
        <td class="col_3">Test</td>
    </tr>
    <tr class="row_3" onmouseover="on_cell('row', this);" onmouseout="out_cell('row', this);">
        <td class="col_1">Test</td>
        <td class="col_2">Test</td>
        <td class="col_3">Test</td>
    </tr>
</table>
```

 

Går ju naturligtvis att göra snyggare t.ex. genom att ge td-arna klasser i stället för att sätta attribut direkt.

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

## #3 — wborg, 2006-03-09T01:05Z

Tack Csson!! Du är just nu kung :D

/S

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

---

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