JQuery offset () возвращает отрицательное значение в столбце CSS3? - PullRequest
0 голосов
/ 05 октября 2011

Я новичок в jQuery. Я хочу получить верхнее смещение определенного элемента. Я использую следующий метод:

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

Однако возвращает отрицательное значение. Я не могу понять, почему он вернет отрицательное значение? Наименьшее значение должно быть равно нулю, или я ошибаюсь?

P.S. Я использую разрыв столбца CSS3 в HTML-файле.

Большое спасибо !!!

РЕДАКТИРОВАТЬ: тело HTML-файла:

<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>

Код, который я использовал для определения высоты изображения:

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

1 Ответ

0 голосов
/ 05 октября 2011

Вам будет легко помочь, если вы разместите HTML-часть, где находится img, а также CSS, примененный к нему.

EDIT:

Я проверил код, который вы разместили, и у меня были синтаксические ошибки в части jQuery, после их исправления я попытался как в Firefox, так и в Google Chrome, все работает нормально.

Так что вы можете попробовать следующий HTML-файл и посмотреть? Единственное отличие заключается в двойных кавычках и добавлении закрывающей скобки, отсутствующей в коде jQuery.

Это работает в 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>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...