11 svar · 324 visningar · startad av Jesper T
Jag vill att det andra lagret skall lägga sig över det första när jag väljer att "visa" det, nu lägger sig det andra lagret under det första.
<div align="left" style="position:relative;">
<textarea name="textfield" cols="40" rows="3"></textarea>
</div>
<div id="lager" style="position:absolute; visibility:hidden;" left:2px; top:2px>
123
</div>
Nu ser det ut så här:
<div style="position:relative;"> <div align="left" style="position:absolute;z-index:1;">
<textarea name="textfield" cols="40" rows="3"></textarea>
</div>
<div id="lager" style="position:absolute;z-index:2; visibility:hidden;">
123
</div></div>
Visserligen överlappar de varandra, men hamnar utanför och för långt ner i min tabell. Det måste väl vara position:relative, om de skall hamna i tabellen?
(skapade ett 3:de lager av den anledningen)
Några idéer?
är det något sådant här du menar?
<script type="text/javascript">
function swap()
{
document.all('lager').style.zIndex=2;
document.all('lager').style.visibility="visible";
document.all('texten').style.zIndex=1;
}
</script>
<div style="position:relative;"> <div id="texten" align="left" style="position:absolute;z-index:2;">
<textarea name="textfield" cols="40" rows="3"></textarea>
<input type="button" onclick="swap()" value="ändra">
</div>
<div id="lager" style="position:absolute;z-index:1;visibility:hidden;">
123
</div></div>
Denna kod fungerar dock bara i IE. Om du vil få den att funger i övriga får du ju göra en vacker browsersniffer-funktion.
Gamla NS använder sig av dessa om jag inte missminner mig:
document.layer['lager']
document.layer['texten']
Och nya NS samt de andra DOM-läsarana använder detta:
document.getElementById('lager')
document.getElementById('texten')
Exakt vad jag behövde! Jag skall trixa lite så att jag får till det i N.S oxo. Återkommer.
Har försökt att trixa lite men den säger att objektet krävs:
<script language="Javascript">
function swap(){
browserVer=parseInt(navigator.appVersion);
browserName=navigator.appName;
if (browserName == "Microsoft Internet Explorer")
{
document.all('lager').style.zIndex=2;
document.all('lager').style.visibility="visible";
document.all('texten').style.zIndex=1;
}
else {
document.getElementById('lager').style.zIndex=2;
document.getElementById('lager').style.visibility="show";
document.getElementById('texten').style.zIndex=1;
}
}
</script>
Vad kan vara fel?
Gör såhär istället:
<script language="Javascript">
function swap(){
if (document.all)
{
document.all('lager').style.zIndex=2;
document.all('lager').style.visibility="visible";
document.all('texten').style.zIndex=1;
}
else if (document.getElementById){
document.getElementById('lager').style.zIndex=2;
document.getElementById('lager').style.visibility="show";
document.getElementById('texten').style.zIndex=1;
}
else if (document.layers){
document.layers['lager'].style.zIndex=2;
document.layers['lager'].style.visibility="show";
document.layers['texten'].style.zIndex=1;
}
}
</script>
Nej, det ser fortfarande konstigt ut. Jag har trixat nu med detta hur mycket som helst.
Jag vill att lagret/lagerna skall ligga i tabellen!
Om jag sätter relative så kan jag få textfältet(formen) att ligga rätt, men då hamnar "123-lagret" under men det skall ju lägga sig över textfältet ju.
Det beror på att höjden i den övre tabellen är upptvingad till 90 pixel utan att det finns något innehåll i cellen som ockuperar plats (ett lager gör det ju inte eftersom det är löst flytande). Eftersom default-värdet för vertical align i en cell är "middle" så blir "insättningspunkten" (det som blir top-vänster på lagret) mitt i cellen. Prova att sätta valign="top" i den första cellen.
<table width="400" border="1" cellspacing="0" cellpadding="2" bgcolor="#FFFFCC" height="90">
<tr>
<td valign="top">
...osv...
Tack!
Det var alltså inte svårare. :r