jquery獲取元素在瀏覽器中位置的方法有哪些

這篇文章主要介紹了jquery獲取元素在瀏覽器中位置的方法有哪些，具有一定借鑒價(jià)值，需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。

1、獲取對(duì)象(自定義調(diào)整打開(kāi)新窗口參照元素)

var obj = $(”#oButton”);

實(shí)例中我獲取的對(duì)象是彈出窗口按鈕，這樣創(chuàng)建的新窗口就會(huì)根椐按鈕的位置進(jìn)行調(diào)整，實(shí)例中將創(chuàng)建的新窗口顯示的按鈕的右下角。

2、獲取對(duì)象元素的位置(offset()方法)

var offset = obj.offset();

獲取對(duì)象元素的位置，分別是元素的top和left，調(diào)用方法是：offset.left和offset.top，可知當(dāng)前對(duì)象的左部和頂部位置。

3、獲取對(duì)象元素的寬度(width()方法)

var right = offset.left+obj.width();

實(shí)例中是獲取對(duì)象的右下角位置，創(chuàng)建新窗口的左部位置。

4、獲取對(duì)象元素的高度(height()方法)

var down = offset.top+obj.height();

實(shí)例中是獲取對(duì)象的右下角位置，創(chuàng)建新窗口的頂部位置。

5、定義CSS樣式，分別設(shè)置左部和頂部。

‘left’:right,
‘top’:down,

要注意CSS樣式中margin和padding的值，以及瀏覽器IE與firefox兼容等效果。

結(jié)合上面實(shí)例，jQuery獲取元素位置以及高度與寬度非常簡(jiǎn)單，通過(guò)內(nèi)置方法offset()，width()和height()實(shí)現(xiàn)我們的動(dòng)態(tài)調(diào)整打開(kāi)新窗口功能，對(duì)于其它擴(kuò)展應(yīng)用來(lái)說(shuō)也一樣，了解jQuery獲取元素位置以及高度與寬度方法，對(duì)于創(chuàng)建新元素，調(diào)整元素位置與大小，將非常實(shí)用。

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享jquery獲取元素在瀏覽器中位置的方法有哪些內(nèi)容對(duì)大家有幫助，同時(shí)也希望大家多多支持億速云，關(guān)注億速云行業(yè)資訊頻道，遇到問(wèn)題就找億速云，詳細(xì)的解決方法等著你來(lái)學(xué)習(xí)!