Layer display

3 svar · 271 visningar · startad av SteveP 2 sep. 2003

StevePMedlem sedan mars 2003751 inlägg

2 sep. 2003 11:51#1

Jag har en sida med ca 50 rader

Namn ------- länk ------- datum ------- description
Namn ------- länk ------- datum ------- description
Namn ------- länk ------- datum ------- description
Namn ------- länk ------- datum ------- description
Namn ------- länk ------- datum ------- description

När man drar musen över Description så ska ett lager visas med Description texten i.

Hör gör jag detta på bästa vis?

Det viktigaste är att lagret visas brevid den Description man drar musen över.

matsbjorkMedlem sedan jan. 200278 inlägg

2 sep. 2003 12:24#2

Re: Layer display

En enklare variant för Internet Explorer är:

<BODY>

<script language=JavaScript>
function ShowDesc(name,what)
{
var vis;
var nName;
nName = name + "_d";
if(what==0){vis = 'hidden'}
if(what==1){vis = 'visible'}

document.all[nName].style.visibility=vis;
}
</script>

<table border=1>

<tr>
<td>
	<span id="nr1" onMouseOver="ShowDesc(this.id,1)" onMouseOut="ShowDesc(this.id,0)">
	<table cellpadding=0 cellspacing=0><tr><td width=100>Name</td><td width=100>Desc >></td></tr></table>
	</span>
</td>
<td>
	<span id="nr1_d" style="visibility:hidden;">Detta är beskrivningen</span>
</td>
</tr>

<tr>
<td>
	<span id="nr2" onMouseOver="ShowDesc(this.id,1)" onMouseOut="ShowDesc(this.id,0)">
	<table cellpadding=0 cellspacing=0><tr><td width=100>Name 2</td><td width=100>Desc >></td></tr></table>
	</span>
</td>
<td>
<span id="nr2_d" style="visibility:hidden;">Detta är beskrivningen på den andra raden</span>
</td>
</tr>

</table>

</BODY>

Mycket nöje!

dectgapMedlem sedan sep. 20021 542 inlägg

2 sep. 2003 12:27#3

En enkel justering för att få det att fungera i andra läsare:

<BODY>

<script language=JavaScript>
function ShowDesc(name,what)
{
var vis;
var nName;
nName = name + "_d";
if(what==0){vis = 'hidden'}
if(what==1){vis = 'visible'}

document.getElementById(nName).style.visibility=vis;
}
</script>

<table border=1>

<tr>
<td>
	<span id="nr1" onMouseOver="ShowDesc(this.id,1)" onMouseOut="ShowDesc(this.id,0)">
	<table cellpadding=0 cellspacing=0><tr><td width=100>Name</td><td width=100>Desc >></td></tr></table>
	</span>
</td>
<td>
	<span id="nr1_d" style="visibility:hidden;">Detta är beskrivningen</span>
</td>
</tr>

<tr>
<td>
	<span id="nr2" onMouseOver="ShowDesc(this.id,1)" onMouseOut="ShowDesc(this.id,0)">
	<table cellpadding=0 cellspacing=0><tr><td width=100>Name 2</td><td width=100>Desc >></td></tr></table>
	</span>
</td>
<td>
<span id="nr2_d" style="visibility:hidden;">Detta är beskrivningen på den andra raden</span>
</td>
</tr>

</table>

</BODY>

PepeJeriaMedlem sedan feb. 2003779 inlägg

2 sep. 2003 13:01#4

och om man vill trimma koden liten kan man:

<script type="text/javascript">
function ShowDesc(name)
{
	var obj = document.getElementById(name + "_d");
	obj.style.visibility = (obj.style.visibility == "visible")? "hidden":"visible";
}
</script>