var obj = $(”#oButton”);
實例中我獲取的對象是彈出窗口按鈕,這樣創建的新窗口就會根椐按鈕的位置進行調整,實例中將創建的新窗口顯示的按鈕的右下角。
2、獲取對象元素的位置(offset()方法)var offset = obj.offset();
獲取對象元素的位置,分別是元素的top和left,調用方法是:offset.left和offset.top,可知當前對象的左部和頂部位置。
3、獲取對象元素的寬度(width()方法)var right = offset.left+obj.width();
實例中是獲取對象的右下角位置,創建新窗口的左部位置。
4、獲取對象元素的高度(height()方法)var down = offset.top+obj.height();
實例中是獲取對象的右下角位置,創建新窗口的頂部位置。
5、定義CSS樣式,分別設置左部和頂部。‘left’:right, ‘top’:down,
對於上面的代碼,我們可以使用“HTML在線編輯器”進行測試一下。
要注意CSS樣式中margin和padding的值,以及浏覽器IE與firefox兼容等效果。
結合上面實例,jQuery獲取元素位置以及高度與寬度非常簡單,通過內置方法offset(),width()和height()實現我們的動態調整打開新窗口功能,對於其它擴展應用來說也一樣,了解jQuery獲取元素位置以及高度與寬度方法,對於創建新元素,調整元素位置與大小,將非常實用。
本文來源:(http://blog.csdn.net/shaerdong/article/details/7924170)