Layer Inline
http://dynapi.sourceforge.net/
GNU LESSER GENERAL PUBLIC LICENSE
Version 2.1, February 1999
<html>
<head>
<title>DynAPI Examples - DynLayer [Inline]</title>
<script language="JavaScript" src="./dynapisrc/dynapi.js"></script>
<script language="Javascript">
dynapi.library.setPath('./dynapisrc/');
dynapi.library.include('dynapi.library');
dynapi.library.include('dynapi.debug');
dynapi.library.include('dynapi.api');
dynapi.library.include('dynapi.api.ext.DynLayerInline');
</script>
<script language="Javascript">
var mylayer, mychild, mygrandchild ;
dynapi.onLoad(init);
function init() {
mylayer = DynLayer.getInline("mylayer");
mychild = DynLayer.getInline("mychild", mylayer);
// new method
mygrandchild = new DynLayer(); // create layer
mygrandchild.setID('mygrandchild',true); // set inline id
mychild.addChild(mygrandchild); //make sure to add the child to it's parent!
var el = {
onmousedown : function(e) {
dynapi.debug.print('mousedown on '+e.getSource().id)
e.preventBubble();
}
}
mylayer.addEventListener(el);
mychild.addEventListener(el);
mygrandchild.addEventListener(el);
};
function checkProperties(dlyr) {
var str = 'id = '+dlyr.id+'\n'+
'parent id = '+dlyr.parent.id+'\n'+
'x = '+dlyr.x+'\n'+
'y = '+dlyr.y+'\n'+
'w = '+dlyr.w+'\n'+
'h = '+dlyr.h+'\n'+
'clip = '+dlyr.clip+'\n'+
'z = '+dlyr.z+'\n'+
'visible = '+dlyr.visible+'\n'+
'bgColor = '+dlyr.bgColor+'\n'+
'bgImage = '+dlyr.bgImage+'\n'+
'html = '+dlyr.html+'\n';
alert(str);
}
</script>
<style type="text/css">
<!--
#mylayer {position:absolute; left:250px; top:50px; width:200px; height:200px; clip:rect(0px 200px 200px 0px); background-color:red; layer-background-color:red;}
#mychild {position:absolute; left:50px; top:50px; background-color:yellow; z-index:5; layer-background-color:yellow; layer-background-image:url("../src/dynapi/images/blank.gif");}
#mygrandchild {position:absolute; left:50px; top:100px; background-color:lime; z-index:5; layer-background-color:lime; layer-background-image:url("../src/dynapi/images/blank.gif");}
-->
</style>
</head>
<body bgcolor="#999999">
<p>Check Properties of:<br>
<a href="javascript:checkProperties(mylayer)">mylayer</a><br>
<a href="javascript:checkProperties(mychild)">mychild</a><br>
<a href="javascript:checkProperties(mygrandchild)">mygrandchild</a>
<div id="mylayer">
mylayer is inline
<div id="mychild">
mychild is inline
<div id="mygrandchild">
mygrandchild is inline
</div>
</div>
</div>
</body>
</html>
dynapi.zip( 791 k)Related examples in the same category