2013年1月11日金曜日

[script.aculo.us]Drag とコールバック

drag2 で囲まれた div 領域をドラッグし、その時にコールバック関数を呼び出して処理する。
Example: index.html
<script type="text/javascript">
<!--
new Draggable('drag2', {
        onDrag: function(element, event) {
        var x = element.handle.style.left;
        var y = element.handle.style.top;
        element.handle.innerHTML = 'location:<br /> [' + x + ', ' + y + ']';
        },
        onEnd: function(element, event) {
        element.handle.innerHTML = 'ドラッグ完了';
        }
});
-->
</script>
Example: style.css
div.drag2_div {
 position: absolute;
 left: 20px;
 top: 150px;
 width: 120px;
 height: 60px;
 background-color: #ccffff;
}

0 件のコメント:

コメントを投稿