拖曳方塊

悲劇了
拖曳方塊這功能 jQuery 官方 UI 就有了
找時間研究一下...

---

↓舊文日期提升自：2010-08-25 07:12:41↓

這次做得特別久
因為很多摸基隆的事情
資料都是慢慢 Google 出來的

摸基隆的原因有兩個原因
其一是我對"事件"不了解
其二是 IE 不遵守標準
一開始不使用 jQuery 大約花了5小時寫出來

因為對大部分人來說是10分鐘就能寫出來的東西
所以不展示作品了
這次的重點放在 jQuery

精簡方法是只列出 X 方向的程式碼、不列變數間的四則運算
上為普通版本
下為使用 jQuery

function mousedown(e){

    document.getElementById("main").onmousemove = function(ex){

        var e = ex || window.event; //要將不同瀏覽器中正確的事件對象賦值給變數 e

        document.getElementById("item").style.left = tempx + "px";

    };

    document.getElementById("item").onmouseup = function(){

        document.getElementById("main").onmousemove = null;

        document.getElementById("item").onmouseup = null;

    };

}

function mousedown(e){

    $("#main").mousemove(function(e){

        var e = ex || window.event; //不需要了，jQuery 已幫我處理。

        $("#item").css("left",tempx + "px");

    });

    $("#item").mouseup(function(e){

        $("#main").unbind("mousemove");

        $("#item").unbind("mouseup");

    });

}

jQuery 做到 程式碼簡化 與 使FF跟IE統一