Warum bekomme ich den gleichen Wert in Offset und Position in jQuery?

Question

Ich habe einen Bereich innerhalb der Absatzmarke platziert, jetzt sollte die Position oben als 0 angezeigt werden und der Offset sollte einen anderen Wert anzeigen (muss aus dem Dokument berechnet werden), aber ich erhalte den gleichen Wert in beiden ...

Ich bin falsch?

dies ist mein Code:

HTML:

<div></div> 
<p>paragraph<span>span</span>paragraph</p> 

JQuery:

$('span').click(function(){ 
console.log($(this).position().top,$(this).offset().top) 
}) 

CSS: 

p{ 
    color:green; 
} 

span{ 
    color:red; 
} 

div{ 
    height:100px; 
    border:2px solid blue; 
} 

jsfiddle here

Answer 1

vom docs

The .position() Verfahren ermöglicht es uns, relative to the offset parent die aktuelle Position eines Elements abzurufen.

Vergleichen Sie dies mit .offset(), die retrieves the current position relative to the document.

Beim Positionieren eines neuen Elements in der Nähe eines anderen Elements und innerhalb desselben DOM-Elements ist .position() sinnvoller.

Wenn wir über Ihr Szenario sprechen dann:

currrently beid .position() und .offset() haben gleich Eltern und sie werden die Offset-Position des Dokuments erhalten.

Nun, wenn Sie fügen Sie ein weiteres Attribut in der CSS-Klasse von <p>position:relative; Sie den Unterschied dann finden können.

Kurz:

.offset().top die oben aus dem Dokument erhalten.

.position().top wird die Spitze von der relativen Eltern erhalten.(Wenn Eltern relativ eingestellt)

Sie den Unterschied finden Sie hier: http://jsfiddle.net/BhsrS/1/

Kasse die Geige: http://jsfiddle.net/BhsrS/1/

Answer 2

Stellen Sie die position Eigenschaft des p Tag relative:

p { 
    color: green; 
    position: relative; 
} 

http://jsfiddle.net/zPdxB/

Answer 3

jQuery: Difference between position() and offset()

Position referes in die Position relativ zum Offsetmutter, die tatsächlich das Dokument in Ihrem Beispiel, weil die p kein positioniertes Element ist, sondern inline . Deshalb erhalten Sie die gleichen Werte zurück.

Wenn Sie Ihr p-Element eine absolute oder relative Positionierung haben, ist die Position des Bereichs nun relativ zum P-Element, wie Sie ursprünglich erwartet hatten, und daher ein anderer Wert als der Offset.