Simple moveable Div with an image and without an image restricted to the Browser Window
This example show 2 movetable Divs which are restricted to the Browser Window, when you compare this with the example before you will notice that you cant move the Div outside the screen.
This is simple add over the class dynDiv_bodyLimit.
This is a Test Div with ByRei DynDiv, move it ;)
HTML Code
<link rel="stylesheet" type="text/css" href="byrei-dyndiv_0.5.css">
<script type="text/javascript" src="byrei-dyndiv_1.0rc1.js"></script>
[Custom or additional CSS Code]
<div id="testdiv_1" class="dynDiv_moveDiv dynDiv_bodyLimit">
This is a Test Div with ByRei DynDiv, move it ;)
</div>
<div id="testdiv_2" class="dynDiv_moveDiv dynDiv_bodyLimit"></div>
Additional CSS Code
#testdiv_1 {
width: 200px;
height: 200px;
background: #ccc;
border: 1px solid #aaa;
padding: 10px;
top: 200px;
left: 250px;
position: absolute;
}
#testdiv_2 {
width: 295px;
height: 394px;
right: 10px;
top: 160px;
border: 1px solid #aaa;
background: url('../example.jpg') no-repeat;
position: absolute;
}