ウィンドウを動かせない部分を作るには

質問

CSS
#popup{
display:none;
}

JS
function movewindow(content){
content="<div class='movable_controller'>この部分をドラッグすると移動する</div><div>この部分をドラッグしても移動しない</div>";
popup(content)
}
function popup(content){
var div = document.getElementById("popup");
var style = div.style;
div.innerHTML = content;
style.display = "block";
}

HTML
<input type=button onclick=movewindow('ウィンドウ内容')></input>
<DIV id="popup" style="position:absolute; z-Index:999;" class="movable"></DIV>
<script src="element_mover-1.0.js" type="text/javascript"></script>

http://www.vividcode.info/projects/jsminilib/element_mover.html
こちらのElement をドラッグで移動可能にする JavaScript ライブラリを使っています

class=movavleを適応しているdivの中にclass=movable_controllerのdivを入れているので
記述は間違ってないと思うんですが、この部分をドラッグしても移動しない　の部分でもドラッグできてしまいます
何か間違っているのでしょうか？

回答No.1

fujillin

想像で回答してますが…

element_moverの初期設定で、DOM要素を確認してその構成を読取っているのではないでしょうか。
そのため後から内容を変更しても、それが反映されないのではないかと想像します。
element_moverの内容を確認してみてください。

逆に、最初から
<div id="popup" style="position:absolute; z-Index:999;" class="movable">
<div class='movable_controller'>この部分をドラッグすると移動する</div>
<div>この部分をドラッグしても移動しない</div>
</div>
としておけば、ちゃんと認識されるのではないかと想像します。

もしも、後から可動/非可動を制御したいのであれば、最初から（↑）のようなソース設定にしておいて（＝可動状態）、非可動にしたい場合はmovable_controllerの部分を非表示にするなどで、制御できそうな気がしますが…。