jQuery中尺寸與座標函式

2021-07-12 04:15:02 字數 1401 閱讀 6498

一、獲得座標

1.offset() 

offset() 方法返回或設定匹配元素相對於文件的偏移(位置)。(即視口座標) 

該方法返回的物件包含兩個整型屬性:top 和 left,以畫素計。 

此方法只對可見元素有效。 

**:alert("內框座標為:("+$(".samll").offset().left+","+$(".samll").offset().top+")");

結果:2.position() 

position() 方法返回匹配元素相對于父元素的位置(偏移)。(相對于父元素的文件座標) 

該方法返回的物件包含兩個整型屬性:top 和 left,以畫素計。 

此方法只對可見元素有效。 

**:$(function());

結果:3.offsetparent() 

offsetparent() 方法返回最近的祖先定位元素。 

定位元素指的是元素的 css position 屬性被設定為 relative、absolute 或 fixed 的元素。 

可以通過 jquery 設定 position,或者通過 css 的 position 屬性。 

二、獲得尺寸

1.width() 和 height() 方法 

width() 方法設定或返回元素的寬度(不包括內邊距、邊框或外邊距)。 

height() 方法設定或返回元素的高度(不包括內邊距、邊框或外邊距)。 

**:$(function());

結果:2.innerwidth() 和 innerheight() 方法 

innerwidth() 方法返回元素的寬度(包括內邊距)。 

innerheight() 方法返回元素的高度(包括內邊距)。

**:alert("內框內部尺寸為:("+$(".samll").innerwidth()+","+$(".samll").innerheight()+")");

結果:3.outerwidth() 和 outerheight() 方法 

outerwidth() 方法返回元素的寬度(包括內邊距和邊框)。 

outerheight() 方法返回元素的高度(包括內邊距和邊框)。 

**:alert("內框外部尺寸為:("+$(".samll").outerwidth()+","+$(".samll").outerheight()+")");

結果:outerwidth(true) 方法返回元素的寬度(包括內邊距、邊框和外邊距)。 

outerheight(true) 方法返回元素的高度(包括內邊距、邊框和外邊距)。

**:

alert("內框尺寸為:("+$(".samll").outerwidth(true)+","+$(".samll").outerheight(true)+")");

結果:

jQuery中ready函式與匿名函式的強制執行

當dom 文件物件模型 全部載入完並頁面 包括影象 完全呈現之後,執行ready 函式。ready 函式僅能用於當前文件,因此無需選擇器。形式 能用jquery的預設別名 替代jquery。ready 函式不應該與一起使用。形式 function jquery 其實際上是執行了 function p...

實現文字自動橫移 jquery尺寸相關函式

效果圖 一實現文字自動橫移 一 採用jquery方式實現文字橫移 二 採用原生script實現橫移 附 jquery尺寸 width 方法設定或返回元素的寬度 不包括內邊距 邊框或外邊距 height 方法設定或返回元素的高度 不包括內邊距 邊框或外邊距 innerwidth 方法返回元素的寬度 包...

列印中,裝置座標與邏輯座標轉換

1 在螢幕的cdc中繪圖時的座標轉換 系統邏輯座標 螢幕座標 pdc邏輯座標 我們呼叫getwindowrect獲得的是視窗的螢幕座標size。由於pdc預設的mapmode是mm text,所以我們可以直接使用size作為邏輯大小填充視窗。當然我們可以改變pdc的mapmode,這樣我們邏輯座標是...