---
title: "\"alt/title-ruta\""
type: "forum-thread"
url: "https://www.webforum.nu/amne/html-css/90895-alt-title-ruta"
topic: "HTML & CSS"
topic_url: "https://www.webforum.nu/amne/html-css"
author: "ampy"
published: "2003-11-20T20:13:07.000Z"
updated: "2003-11-24T09:05:16.000Z"
replies: 9
views: 497
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/90895-alt-title-ruta"
---

# "alt/title-ruta"

## #1 — ampy, 2003-11-20T20:13Z

Vad kallas den ljusgulsaktiga rutan som kommer fram när man håller musen över länkar eller bilder?
Kallas rutan för något speciellt eller har den något vanligt förekommande slang?

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

## #2 — @nders, 2003-11-20T20:18Z

Jag brukar säga tooltip.

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

## #3 — nitro2k01, 2003-11-21T08:18Z

Japp, Tooltip brukar det kallas. Vissa intet ont anande personer kalalr det felaktigt för popup-rutor.

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

## #4 — PepeJeria, 2003-11-21T13:45Z

För att få denna tooltip använder du dig av title, inget annat...

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

## #5 — bossse, 2003-11-23T21:52Z

Finns även ett alternativ till alt eller title, som inte släcks efter 5 sekunder.
Men det kanske du kände till sen tidigare.

```
<html> 
<head> 
<title>LänkBeskrivning</title> 
<style type="text/css"> 
<!-- 

.box { 
z-index: -1;
padding: 5px; 
height: 100px; 
width: 200px;
background-color: lightgreen; 
border: 3px solid yellow; 
} 
--> 
</style> 

</head>
<BODY bgcolor=lightblue> 
<DIV ID="lanktexten" STYLE="position: relative; visibility: hidden ;"></DIV> 

<SCRIPT LANGUAGE="javascript"> 
html_fore="<TABLE CELLPADDING=3 BORDER=1 CELLSPACING=3><TR><TD STYLE='background-color: orange; font-family: arial, verdana; font-size:8pt; color:blue'>" 
html_efter="</TD></TR></TABLE>"

 
Xled=20 
Yled=-30 
divnamn="lanktexten"; 
function visa(txt) 
{ 
if (txt) 
{ 
txt=html_fore+txt+html_efter 
if (document.all) 
{ 
document.all[divnamn].innerHTML=txt; 
document.all[divnamn].style.visibility="visible"; 
} 
else if (document.layers) 
{ 
document[divnamn].document.open(); 
document[divnamn].document.write(txt); 
document[divnamn].document.close(); 
document.layers[divnamn].visibility="visible"; 
} } 
else 
{ 
if (document.all) 
{ 
document.all[divnamn].innerHTML=""; 
document.all[divnamn].style.visibility="hidden"; 
} 
else if (document.layers) 
{ 
document[divnamn].document.open(); 
document[divnamn].document.write(""); 
document[divnamn].document.close(); 
document.layers[divnamn].visibility="hidden"; 
} } } 
if (document.all) 
{ 
document.onmousemove = musen_flyttar; 
} 
else if (document.layers) 
{ 
window.captureEvents(Event.MOUSEMOVE); 
window.onMouseMove = musen_flyttar; 
} 
var Xmusposition, Ymusposition; 
function musen_flyttar(ev) 
{ 
if (document.all) 
{ 
Xmusposition = window.event.x; 
Ymusposition = window.event.y; 
} 
else if (document.layers) 
{ 
Xmusposition = ev.pageX; 
Ymusposition = ev.pageY; 
} 
flytta_lager(divnamn,Xmusposition+Xled,Ymusposition+Yled); 
} 
function flytta_lager(lagernamn,x,y) 
{ 
if (document.all) 
{ 
document.all[lagernamn].style.left = x+document.body.scrollLeft; 
document.all[lagernamn].style.top = y+document.body.scrollTop; 
} 
else if (document.layers) 
{ 
document.layers[lagernamn].left = x; 
document.layers[lagernamn].top = y; 
} } 
//--> 
</SCRIPT> 

<p class="box" style="position: absolute; top: 20; left: 5;">
<table width=150 height=150>
<tr>
<td>
<A HREF="dinsida1.htm" onMouseOver="visa('<B><FONT SIZE=2>Menade du så här kanske ? </FONT> ');" onMouseOut "this.style.backgroundColor='green';="visa();">Länk 1</A> 
</td>
</tr>
<tr>
<td>
<A HREF="dinsida2.htm" onMouseOver="visa('<B><FONT SIZE=2>Jag tror nästan det va</FONT> ');" onMouseOut="visa();">Länk 2</A> 
</td>
</tr>
<tr>
<td>
<A HREF="dinsida3.htm" onMouseOver="visa('<B><FONT SIZE=2>Går även bra med en bild <img src=dinbild.gif width=50 height=50></FONT> ');" onMouseOut="visa();"> <img src=dinbild.gif width=30 height=30></A> 
</td>
</tr>
<tr>
<td>
<A HREF="dinsida4.htm" onMouseOver="visa('<B><FONT SIZE=2>Radbrytning går också bra <BR> Va tycker du, Inte så illa va ? <BR> Rutan blir större, ju mer text den innehåller</FONT> ');" onMouseOut="visa();">Länk 4</A> 
</td>
</tr>
</table>
</body> 
</html>
```

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

## #6 — PepeJeria, 2003-11-23T22:05Z

Det här alternativet fungerar bara i IE och Netscape 4 (som ingen använder längre), sen kommer det också hamna under iframes eller dropdowns. Går att ändra dock så att det även fungerar i nyare browsers.

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

## #7 — Peeer, 2003-11-23T22:09Z

Ampy frågade visserligen bara vad rutan hette, men om ni känner att ni vill posta koder till diverse tooltip-rutor så go ahead :OO ;)

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

## #8 — ampy, 2003-11-23T22:31Z

Tack för alla svar, kör på "tooltip" då.  :)

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

## #9 — Jesper T, 2003-11-24T09:01Z

Jojoxx har ett som funkar i de flesta webläsare:
<http://www.jojoxx.net/dhtml/examples/tooltip.html>

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

## #10 — Web-Tor, 2003-11-24T09:05Z

**ampy »**
Markera gärna tråden som löst.

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

---

Tråden på webben: https://www.webforum.nu/amne/html-css/90895-alt-title-ruta
