Resizable and moveable div with hide on action
There are 2 special Options for dynDIV's with this options you can hide other dynDIVs on resize and / or movements.
You can simple enable this feature with "dynDiv_hideResize" and "dynDiv_hideMove".
dynDiv_hideResize
dynDiv_hideMove
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_hideResize">
<p style="padding: 10px;"> dynDiv_hideResize </p>
<div class="dynDiv_resizeDiv_tl"></div>
<div class="dynDiv_resizeDiv_tr"></div>
<div class="dynDiv_resizeDiv_bl"></div>
<div class="dynDiv_resizeDiv_br"></div>
</div>
<div id="testdiv_2">
<img src="../example.jpg" width="100%" height="100%" alt="">
<div id="testdiv_2_move" class="dynDiv_moveParentDiv dynDiv_hideMove"> dynDiv_hideMove </div>
<div class="dynDiv_resizeDiv_tl"></div>
<div class="dynDiv_resizeDiv_tr"></div>
<div class="dynDiv_resizeDiv_bl"></div>
<div class="dynDiv_resizeDiv_br"></div>
</div>
Additional CSS Code
#testdiv_1 {
width: 150px;
height: 150px;
background: #ccc;
border: 1px solid #aaa;
top: 300px;
left: 350px;
position: absolute;
}
#testdiv_2 {
width: 295px;
height: 394px;
right: 10px;
top: 160px;
border: 1px solid #aaa;
position: absolute;
}
#testdiv_2_move {
text-align: center;
filter:alpha(opacity=50);
opacity:0.5;
color: #fff;
}