Sådan ... de andre funktioner med opacity må komme senere
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "
http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title><meta name="robots" content="noindex, nofollow">
<style type="text/css">
/* Demo page css */
html,body{margin:0px;padding:0px;border:0px;}
body{padding:10px;font:14px arial,sans-serif;position:relative;}
/* Needed for script */
#mcp_div{overflow:hidden;}
.mcp_abs{position:absolute;top:0px;left:0px;}
.mcp_app{position:relative;height:0px;overflow:hidden;}
</style>
<script type="text/javascript">
/* MCPosition:absolute layer */
/* Script by Marc Clemmensen */
/*
http://exp.dk/spm/715114 */
/* - - - Version: 0.91 - - - */
/* Free use - keep this note */
/* If changed add extra note */
/* Changeable values */
mcpcs=10; // Speed of animation in ms.
mcpcp=1; // Amount of pixels used for each change.
/* ----------------- */
/* Don't touch script below unless you know where to edit */
var mcp={}; // Object for transportation of objects and their properties
window.onload=function(){ // Initiate script onload
var tns=document.getElementById("mcp_div").childNodes; // Get object shotcuts and info
for(i=0;i<tns.length;i++)if(tns[i].id){
mcp[tns[i].id]={c:false,h:tns[i].offsetHeight,o:tns[i],s:tns[i].style,w:tns[i].offsetWidth};
tns[i].style.height="0px";tns[i].style.overflow="hidden";
}
}
function mcppos(mcp0,mcp1,mcp2){ // Extend/minimize layers
mcp0=mcp["mcp"+mcp0]; // Activate shortcut
tmpn=document.getElementById(mcp0.o.id+"_"); // Set top postition
tmpt=tmpn.offsetTop;tmpl=tmpn.offsetLeft;
while(tmpn=tmpn.offsetParent){tmpt=tmpt+tmpn.offsetTop;tmpl=tmpn.offsetLeft;}
mcp0.s.top=tmpt+"px";mcp0.s.left=tmpl+"px";
if(mcp1==3)mcp1=!mcp0.c; // Make a check value for the action
else mcp1=(mcp1==1)?true:false;
mcp0.c=mcp1;mcp1=(mcp1)?1:0;
mcpact(mcp0.o.id,mcp1,mcp2); // Activate layer handling
}
function mcpact(mcp0,mcp1,mcp2){
if(!mcp2)mcp2=0;
o=mcp[mcp0]; // Activate shortcut
oh=parseInt(o.s.height.replace("px","")); // Get current height
if((o.c)&&(oh<o.h)&&(mcp1==1)){
if((mcpcp+oh)<(o.h+1)){
if(mcp2==0)o.o.childNodes[0].style.top=-o.h+mcpcp+oh+"px"; // Set top
o.s.height=mcpcp+oh+"px"; // Set new height
setTimeout("mcpact('"+o.o.id+"',1,'"+mcp2+"');",mcpcs); // Loop script
}
}
else if((!o.c)&&(oh>0)&&(mcp1==0)){
if((-mcpcp+oh)>-1){
if(mcp2==0)o.o.childNodes[0].style.top=-o.h+mcpcp+oh+"px"; // Set top
o.s.height=-mcpcp+oh+"px"; // Set new height
setTimeout("mcpact('"+o.o.id+"',0,'"+mcp2+"');",mcpcs); // Loop script
}
}
}
</script></head><body>
<b onclick="mcppos('brev',1)">Vis brev1</b><br>
<b onclick="mcppos('brev',2)">Skjul brev1</b><br>
<b onclick="mcppos('brev',3)">Vis/skjul brev1</b><br><br>
<b onclick="mcppos('brev2',1)">Vis brev2</b><br>
<b onclick="mcppos('brev2',2)">Skjul brev2</b><br>
<b onclick="mcppos('brev2',3)">Vis/skjul brev2</b><br><br>
<b onclick="mcppos('brev3',1,1)">Vis brev3</b><br>
<b onclick="mcppos('brev3',2,1)">Skjul brev3</b><br>
<b onclick="mcppos('brev3',3,1)">Vis/skjul brev3</b><br><br>
Lige nedenunder er mcpbrev<br>
<div id="mcpbrev_" class="mcp_app"> </div>
Lige ovenover er mcpbrev<br><br><br><br><br>
Lige nedenunder er mcpbrev2<br>
<div id="mcpbrev2_" class="mcp_app"></div>
Lige ovenover er mcpbrev2<br><br><br><br><br>
Lige nedenunder er mcpbrev3<br>
<div id="mcpbrev3_" class="mcp_app"></div>
Lige ovenover er mcpbrev2<br><br><br><br><br>
<div id="mcp_div">
<div id="mcpbrev" class="mcp_abs">
<div style="position:relative;width:200px;background:#aaa;border:1px solid #000;margin-bottom:10px;">Small message...<br><b>Bold tag</b><br><br><b onclick="mcppos('brev',1)">Vis brev1</b><br>
<b onclick="mcppos('brev',2)">Skjul brev1</b><br>
<b onclick="mcppos('brev',3)">Vis/skjul brev1</b></div>
</div>
<div id="mcpbrev2" class="mcp_abs">
<div style="position:relative;width:500px;height:300px;background:#888;border:5px solid #000;margin-bottom:10px;margin-left:200px">Longer message...<br><b>Bold tag</b><br><i>Italic tag</i><br><br><b onclick="mcppos('brev2',1)">Vis brev2</b><br>
<b onclick="mcppos('brev2',2)">Skjul brev2</b><br>
<b onclick="mcppos('brev2',3)">Vis/skjul brev2</b></div>
</div>
<div id="mcpbrev3" class="mcp_abs">
<div style="position:relative;width:400px;height:300px;background:#888;border:5px solid #000;margin-bottom:10px;margin-left:100px">Longer message...<br><b>Bold tag</b><br><i>Italic tag</i><br><br><b onclick="mcppos('brev3',1,1)">Vis brev3</b><br>
<b onclick="mcppos('brev3',2,1)">Skjul brev3</b><br>
<b onclick="mcppos('brev3',3,1)">Vis/skjul brev3</b></div>
</div>
</div>
</body></html>
Ny bruger
Nybegynder
Opret
Preview
