Subject line says it all. I need this capability because I have some UI elements that are styled div tags to co-exist with the ListGrid. I experimented with various styling options but to no avail. Any help you can provide would be greatly appreciated.
The code snippet below demonstrates the problem. Despite setting "overflow:visible" (which works for other div tags), the ListGrid still stays on top, and I need it to be "behind" this div.
The code snippet below demonstrates the problem. Despite setting "overflow:visible" (which works for other div tags), the ListGrid still stays on top, and I need it to be "behind" this div.
Code:
<html>
<head>
<style>
.my-style {
overflow: visible;
border: 1px solid black;
}
</style>
<script src="jquery-1.11.0.min.js"></script>
<script>var isomorphicDir="isomorphic/";</script>
<script src="isomorphic/system/modules/ISC_Core.js"></script>
<script src="isomorphic/system/modules/ISC_Foundation.js"></script>
<script src="isomorphic/system/modules/ISC_Containers.js"></script>
<script src="isomorphic/system/modules/ISC_Grids.js"></script>
<script src="isomorphic/system/modules/ISC_Forms.js"></script>
<script src="isomorphic/system/modules/ISC_DataBinding.js"></script>
<script src="isomorphic/system/modules/ISC_Drawing.js"></script>
<script src="isomorphic/skins/SilverWave/load_skin.js"></script>
<script>
$(document).ready( function() {
isc.ListGrid.create({
top: 0,
left: 100,
fields: [
{ name: 'X' },
{ name: 'Y' }
],
items: [
]
});
$('#main').html('<div class="my-style">This is a test</div>');
});
</script>
</head>
<body>
<div id="main" class="my-style">
A sample div tag
</div>
</body>
</html>