DavidBMedlem sedan jan. 20001 140 inlägg
har följande kod:
<script language="JavaScript">
function show(id){
if(document.all){
document.all[id].style.visibility='visible';
} else if (document.layers){
document.layers[id].visibility='visible';
} else if (document.getElementById){
document.getElementById(id).style.visibility='visible';
}
}
function hide(id){
if(document.all){
document.all[id].style.visibility='hidden';
} else if (document.layers){
document.layers[id].visibility='hidden';
} else if (document.getElementById){
document.getElementById(id).style.visibility='hidden';
}
}
</script>
<body onload="javascript:hide('helpwindow')">
<div id="helpwindow" style="position:relative">
<table border="1" cellspacing="0" cellpadding="0" width="150">
<tr>
<td>mer text</td>
</tr>
</table>
<br>
</div>
<table border="1" cellspacing="0" cellpadding="0" width="150">
<tr>
<td><a href="#" onmouseover="javascript:show('helpwindow')" onmouseout="javascript:hide('helpwindow')">visa hjälpfönster</a></td>
</tr>
</table>
det jag nu vill få fungera är att när den övre tabellen är "hidden" så ska den andra tabellen "hoppa upp" och lägga sig på den övres position och när den övre blir "visible" så ska den hoppa ner och hamna på ursprungpositionen. nån som vet?
ejickMedlem sedan mars 20011 175 inlägg
Hmm.. Det är väl bara att trixa till det med position:relative; ?
Du kan ju förenkla scriptet du har enligt följande:
function showHide(name,value)
{
if (document.all)
{
docuemnt.all[name].style.visibility=value;
}
else if (document.layers)
{
document.layers[name].style.visibility=value;
}
else if (document.getElementById)
{
document.getElementById(name).style.visibility=value;
}
}
...
Anrop sker enligt följande:
onMouseOver="showHide('lagernamn','visible_eller_hidden');"
DavidBMedlem sedan jan. 20001 140 inlägg
ändrar jag till position:relative så hamnar den översta tabellen över den andra så att denna inte syns. jag vill ha att båda syns såhär:
när den är onmouseout:
<table border="1" cellspacing="0" cellpadding="0" width="150">
<tr>
<td><a href="#" onmouseover="java script:show('helpwindow')" onmouseout="java script:hide('helpwindow')">visa hjälpfönster</a></td>
</tr>
</table>
och när den är onmouseover så ska den vara såhär:
<table border="1" cellspacing="0" cellpadding="0" width="150">
<tr>
<td>mer text</td>
</tr>
</table>
<br>
<table border="1" cellspacing="0" cellpadding="0" width="150">
<tr>
<td><a href="#" onmouseover="java script:show('helpwindow')" onmouseout="java script:hide('helpwindow')">visa hjälpfönster</a></td>
</tr>
</table>
båda skall alltså synas hela tiden
ordellMedlem sedan sep. 200278 inlägg
Jag vet inte hur du löser det för NS 4, men om du är beredd att släppa den till förmån för NS 6 så kan du använda dig av display istället för visibility.
[style]
display: none;
display: block;
[/style]
Genom att ändra display-egenskapen kan du ändra vilket lager som ändras
JS;
function showhide(lagrets_id)
{
var obj = document.getElementById(lagrets_id)
obj.style.display == 'block' ? obj.style.display = 'none' : obj.style.display = 'block'
}
Nåt sånt :-)
DavidBMedlem sedan jan. 20001 140 inlägg
har kommit såhär långt:
<script language="JavaScript">
function ShowHide(namn,varde){
if (document.all){
if(varde == 'visible'){
document.all[namn].style.visibility='visible';
document.all[namn].style.position='relative';
} else if(varde == 'hidden') {
document.all[namn].style.visibility='hidden';
document.all[namn].style.position='absolute';
}
} else if (document.layers) {
if(varde == 'visible'){
document.layers[namn].visibility='visible';
document.layers[namn].position='relative';
} else if(varde == 'hidden') {
document.layers[namn].visibility='hidden';
document.layers[namn].position='absolute';
}
} else if (document.getElementById) {
if(varde == 'visible'){
document.getElementById(namn).style.visibility='visible';
document.getElementById(namn).style.position='relative';
} else if(varde == 'hidden') {
document.getElementById(namn).style.visibility='hidden';
document.getElementById(namn).style.position='absolute';
}
}
}
</script>
<body onload="ShowHide('helpwindow','hidden')">
<div id="helpwindow" style="position:absolute">
<table border="1" cellspacing="0" cellpadding="0" width="150">
<tr>
<td>asd</td>
</tr>
</table>
</div>
<table border="1" cellspacing="0" cellpadding="0" width="150">
<tr>
<td>
<a href="#" onclick="javascript:ShowHide('helpwindow','visible')">visa</a><br>
<a href="#" onclick="javascript:ShowHide('helpwindow','hidden')">göm</a>
</td>
</tr>
</table>
nu e det bara det problemet att om jag har en "table" i lagret som ovan så visas inte tabellen men om jag lägger endast vanlig text mellan <div> och </div> så fungerar det som det skall, nån som vet vad man kan göra?
sen får någon gärna också kolla om det fungerar med andra webläsare också, har tyvärr bara IE 6 på denna datorn.
här e en länk för er om vill testa.
Peter SMedlem sedan dec. 20025 484 inlägg
Byt ut "relative" mot "static".
:)
DavidBMedlem sedan jan. 20001 140 inlägg
funkade perfekt. tackar :)
DavidBMedlem sedan jan. 20001 140 inlägg
har ett litet problem till, koden ser ut såhär:
<script language="JavaScript">
function ShowHide(namn,varde){
if (document.all){
if(varde == 'visible'){
document.all[namn].style.visibility='visible';
document.all[namn].style.position='static';
} else if(varde == 'hidden') {
document.all[namn].style.visibility='hidden';
document.all[namn].style.position='absolute';
}
} else if (document.layers) {
if(varde == 'visible'){
document.layers[namn].visibility='visible';
document.layers[namn].position='static';
} else if(varde == 'hidden') {
document.layers[namn].visibility='hidden';
document.layers[namn].position='absolute';
}
} else if (document.getElementById) {
if(varde == 'visible'){
document.getElementById(namn).style.visibility='visible';
document.getElementById(namn).style.position='static';
} else if(varde == 'hidden') {
document.getElementById(namn).style.visibility='hidden';
document.getElementById(namn).style.position='absolute';
}
}
}
</script>
<body>
[b]<a href="#" onclick="javascript:ShowHide('helpwindow','visible')" onmouseover="javascript:ShowHide('helpwindow','visible')" onmouseout="javascript:ShowHide('helpwindow','hidden')">länk</a>[/b]<br>
<p>
<div id="helpwindow" style="position:absolute;visibility:hidden">
<table border="1" cellspacing="0" cellpadding="0" width="150">
<tr>
<td>asd</td>
</tr>
</table>
<br>
</div>
<table border="1" cellspacing="0" cellpadding="0" width="150">
<tr>
<td><a href="#" onclick="javascript:ShowHide('helpwindow','hidden')">göm</a><br></td>
</tr>
</table>
Nu är det så att när man har musen över länken (fet stil) så visas lagret, och när man tar bort den så försvinner det. Grejen är den att jag vill ha det så att när man klickar på länken och sedan tar bort musen så ska lagret fortfarande visas. Fast om man inte klickar skall det vara som vanligt.
DavidBMedlem sedan jan. 20001 140 inlägg
Jesper TMedlem sedan nov. 20017 058 inlägg
Då är det väl bara att ta bort detta:
onmouseover="javascript:ShowHide('helpwindow','visible')" onmouseout="javascript:ShowHide('helpwindow','hidden')
DavidBMedlem sedan jan. 20001 140 inlägg
nä, inte riktigt. kanske inte har förklarat riktigt bra.
som det är nu så när man för över musen över länken så visas lagret, när man sedan för bort musen från länken så försvinner det.
såhär vill jag ha det:
när man för över musen över länken så visas lagret, när man sedan för bort musen från länken så försvinner det MEN om man klickade på länken innan man förde bort musen så ska lagret stanna kvar synligt.
Peter SMedlem sedan dec. 20025 484 inlägg
Testa detta:
<head>
<script language="JavaScript">
var clk = null;
function ShowHide(namn,varde){
if (document.all){
if(varde == 'visible'){
document.all[namn].style.visibility='visible';
document.all[namn].style.position='static';
} else if(varde == 'hidden') {
document.all[namn].style.visibility='hidden';
document.all[namn].style.position='absolute';
}
} else if (document.layers) {
if(varde == 'visible'){
document.layers[namn].visibility='visible';
document.layers[namn].position='static';
} else if(varde == 'hidden') {
document.layers[namn].visibility='hidden';
document.layers[namn].position='absolute';
}
} else if (document.getElementById) {
if(varde == 'visible'){
document.getElementById(namn).style.visibility='visible';
document.getElementById(namn).style.position='static';
} else if(varde == 'hidden') {
document.getElementById(namn).style.visibility='hidden';
document.getElementById(namn).style.position='absolute';
}
}
}
</script>
</head>
<body>
<a href="#" onclick="javascript:ShowHide('helpwindow','visible'); clk=this;" onmouseover="javascript:ShowHide('helpwindow','visible')" onmouseout="javascript:if(!clk)ShowHide('helpwindow','hidden')">länk</a><br>
<p>
<div id="helpwindow" style="position:absolute;visibility:hidden">
<table border="1" cellspacing="0" cellpadding="0" width="150">
<tr>
<td>asd</td>
</tr>
</table>
<br>
</div>
<table border="1" cellspacing="0" cellpadding="0" width="150">
<tr>
<td><a href="#" onclick="javascript:ShowHide('helpwindow','hidden')">göm</a><br></td>
</tr>
</table>
:)
DavidBMedlem sedan jan. 20001 140 inlägg
tackar, det var så jag ville ha det men det är en liten bugg.
jag har följande kod (har kortat ner den förra lite):
<script language="JavaScript">
var clk = null;
function ShowHide(name,value){
document.all[name].style.visibility=value;
}
</script>
</head>
<body>
<a href="#" onclick="javascript:ShowHide('window','visible'); clk=this;" onmouseover="javascript:ShowHide('window','visible')" onmouseout="javascript:if(!clk)ShowHide('window','hidden')">länk</a><br>
<a href="#" onclick="javascript:ShowHide('window1','visible'); clk=this;" onmouseover="javascript:ShowHide('window1','visible')" onmouseout="javascript:if(!clk)ShowHide('window1','hidden')">länk1</a><br>
<p>
<div id="window" style="position:absolute;visibility:hidden">
<table border="1" cellspacing="0" cellpadding="0" width="150">
<tr>
<td>asd</td>
</tr>
</table>
</div>
<div id="window1" style="position:absolute;visibility:hidden">
<table border="1" cellspacing="0" cellpadding="0" width="150">
<tr>
<td>asd1</td>
</tr>
</table>
</div>
om man klickar på en länk så stannar det lagret, när man sen bara för musen över nästa länk utan att klicka så stannar detta kvar när man sedan för bort musen
DavidBMedlem sedan jan. 20001 140 inlägg
löste det själv:
onmouseover="javascript:ShowHide('window','visible'); clk=null;"
men det en sak till, att om man har klickat på en länk så att ett lager visas fast. hur gör man då för att detta lager skall försvinna när man för musen över en annan länk? finns det nåt sätt så att man kan sätta alla lager hidden?
