JQuery offset() return negative value with CSS3 column? -


i newbie of jquery. want top offset of particular element. use following method:

var top = $("img").offset().top; 

however, returns negative value. can't understand why return negative value? smallest value should zero, or wrong?

p.s. use css3 column break in html file.

thanks lot!!!

edit: body of html file:

<div id="chapter-0">     <div>         <h1 xml:lang="en-us" id="toc-anchor">main title</h1>         <h2 xml:lang="en-us" id="toc-anchor-1">subtitle 1</h2>         <p xml:lang="zh-hk"> text</p>         <p xml:lang="zh-hk"> text</p>         <h2 xml:lang="en-us" id="toc-anchor-2">subtitle2</h2>         <p xml:lang="zh-hk"> text</p>         <p xml:lang="zh-hk"> text</p>         <h2 xml:lang="en-us" id="toc-anchor-3">subtitle3</h2>         <p xml:lang="zh-hk"> text</p>         <p xml:lang="zh-hk"> text</p>     </div>     <div>         <img src="images/table-01_fmt.jpeg" alt="table-01.indd">     </div> </div> 

the code have used detecting height of image:

$(\"img\").each(function(i) {     var top = $(this).offset().top;     alert(top); } 

it easy if post html part img , css applied it.

edit:

i checked code posted, , had syntax errors in jquery part, after correcting them tried both in firefox , google chrome, works fine.

so can please try following html file , see? difference double-quotes , adding closing bracket missing in jquery code.

this works in chrome.

<!doctype html public "-//w3c//dtd html 4.01//en" "http://www.w3.org/tr/html4/strict.dtd"> <html> <head>     <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js'></script>      <script type='text/javascript'>         $(document).ready(function () {             $("img").each(function(i) {                 var top = $(this).offset().top;                 alert(top);             });         });     </script>  </head> <body> <div id="chapter-0">     <div>         <h1 xml:lang="en-us" id="toc-anchor">main title</h1>         <h2 xml:lang="en-us" id="toc-anchor-1">subtitle 1</h2>         <p xml:lang="zh-hk"> text</p>         <p xml:lang="zh-hk"> text</p>         <h2 xml:lang="en-us" id="toc-anchor-2">subtitle2</h2>         <p xml:lang="zh-hk"> text</p>         <p xml:lang="zh-hk"> text</p>         <h2 xml:lang="en-us" id="toc-anchor-3">subtitle3</h2>         <p xml:lang="zh-hk"> text</p>         <p xml:lang="zh-hk"> text</p>     </div>     <div>         <img src="images/table-01_fmt.jpeg" alt="table-01.indd" />     </div> </div> </body> </html> 

Comments

Popular posts from this blog

objective c - Change font of selected text in UITextView -

php - Accessing POST data in Facebook cavas app -

c# - Getting control value when switching a view as part of a multiview -