Проблема положения jQuery с Chrome - PullRequest
Новая
       67

Проблема положения jQuery с Chrome

20 голосов
/ 31 января 2010

Когда я предупреждаю значение .position().left, возвращается 0 на Chrome . С другими браузерами это возвращает фактическое число. Почему это происходит?

Ответы [ 8 ]

35 голосов
/ 06 июля 2011

Браузеры на основе Webkit (такие как Chrome и Safari) могут получать доступ к свойствам width и height изображений только после полной загрузки изображений. Другие браузеры могут получить доступ к этой информации, как только загружается DOM (им не нужно загружать изображения полностью, чтобы узнать их размер).

Итак, если у вас есть изображения на вашей странице, в браузерах на основе Webkit вы должны получить доступ к информации offset после события $(window).load, а не после события $(document).ready.

8 голосов
/ 28 апреля 2010

Читая комментарии от http://api.jquery.com/position/,, есть несколько способов исправить это. Тот, который я нашел, работает

Ajaho [Модератор]: эта функция плагина исправляет проблемы с неправильным положением в Chrome 

jQuery.fn.aPosition = function() {
    thisLeft = this.offset().left;
    thisTop = this.offset().top;
    thisParent = this.parent();

    parentLeft = thisParent.offset().left;
    parentTop = thisParent.offset().top;

    return {
        left: thisLeft-parentLeft,
        top: thisTop-parentTop
    };
};
7 голосов
/ 31 января 2010

Webkit иногда может быть слишком быстрым, но об этом часто заботятся в jQuery. Вы можете отлаживать, используя что-то вроде: 

var v, elem = $('.myElement');
window.setTimeout(function() {
    v = elem.position().left;
    console.log(v);
    if (v) {
        return false;
    }
    window.setTimeout(arguments.callee, 1);
}, 1);

Это проверит, если и когда позиция доступна. Если вы записываете «0» в бесконечности, position().left «никогда» недоступен, и вам нужно отладить в другом месте.

6 голосов
/ 24 февраля 2010

У меня была такая же проблема ..

Я исправил это, используя: .offset().left вместо. Но учтите, что это не одно и то же http://api.jquery.com/offset/

.position().left работал в Chrome в некоторых тестах, которые я делал, используя похожий подход, чем Дэвид (значение было доступно с первая попытка).

В моем "реальном" приложении не удалось даже чтение позиции по событию щелчка (которое может исключить любую загрузку проблема скорости). Некоторые комментарии (на другом форуме) говорят, что это может быть связано на использование display:inline-block. Однако я не мог воспроизведите проблему, используя inline-block. Так может быть другой вещью.

4 голосов
/ 17 апреля 2011

Возможно, немного устарел, так как вопросы датируются 2010 годом, но это помогло решить мои проблемы с позиционированием в Chrome: 

$(window).load(function(){
  p = $('element').offset();
  // et cetera
});
0 голосов
/ 22 августа 2013

Для меня это сработало, поместив код javascript в документ, готовый непосредственно перед закрытием тега body

Таким образом он выполняет код после загрузки всего 

    <body>
        <div>content</div>
        <div class='footer'>footer</div>
        .
        .
        .

        <script type='text/javascript>
            $(document).ready(function(){
              var footer_position = $(".footer").offset().top;
              console.log(footer_position);
            });
        </script>
     </body>
0 голосов
/ 28 мая 2013

Я использую эту функцию для ее исправления. 

function getElementPosition(id) {
          var offsetTrail = document.getElementById(id);
          var offsetBottom = 0;
          var offsetTop = 0;
          while (offsetTrail) {
              offsetBottom += offsetTrail.offsetBottom;
              offsetTop += offsetTrail.offsetTop;
              offsetTrail = offsetTrail.offsetParent;
          }

          return {
              bottom: offsetBottom,
              toppos: offsetTop
          };
      }
0 голосов
/ 30 марта 2012

используйте jQuery (окно) .load () вместо jQuery (документ) .ready ()

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...