jQuery offset () не работает в некоторых браузерах, на некоторых компьютерах - PullRequest
Новая
       16

jQuery offset () не работает в некоторых браузерах, на некоторых компьютерах

2 голосов
/ 11 марта 2010

У меня проблема с позиционированием элемента в некоторых браузерах. Я использую автозаполнение jQuery, найденное здесь . Элемент div, содержащий значения для автозаполнения, должен находиться непосредственно под текстовым полем и располагаться идеально. Код устанавливает свойство css left для div, используя свойство left, сгенерированное $(textbox).offset();

После распаковки кода, чтобы попытаться исправить мою проблему, я получаю следующее: 

var a = $(textbox).offset();
element.css({
    width: typeof e.width == "string" || e.width > 0 ? e.width : $(textbox).width(),
    top: a.top + textbox.offsetHeight,
    left: a.left
}).show();

Кажется, что это должно работать, и это работает в Firefox. Это не работает в IE8, Chrome. Верхняя позиция всегда правильная, но иногда div слишком далеко влево или слишком далеко вправо.

На разных компьютерах (все с Windows XP) он работает в IE8 ... как это может быть? Я также проверил это на моем Mac OS 10.5. Он работает в Firefox, но не в Safari.

Я отключил плагины, изменил разрешение экрана, изменил размеры окон ... Иногда в некоторых местах это работает непоследовательно.

Кто-нибудь может подумать о чем-то, чего мне не хватает?

UPDATE : Я переработал свой код, чтобы использовать автозаполнение, поставляемое с jQuery 1.4.2 и jQuery UI 1.8rc3. Это все еще сломано, та же проблема. Пожалуйста, помогите!

ОБНОВЛЕНИЕ 2 : См. этот связанный вопрос . JQuery UI прерывает автозаполнение, потому что он использует смещение. У кого-нибудь есть работа вокруг?

Вот javascript из функции автозаполнения пользовательского интерфейса, который отключается: 

.css({ top: (offset.top + this.element.height) + 'px', left: offset.left + 'px' })

Если его изменить на top: '0px', left: '0px', он работает нормально, но, очевидно, находится в неправильном месте.

Ответы [ 2 ]

1 голос
/ 08 августа 2011

Я встретил похожий вопрос, в конце концов обнаружил, что свойство float влияет на relative, что делает relative div нестабильным в Internet Explorer 8, но хорошо работает в Firefox.

1 голос
/ 17 марта 2010

Я наконец понял, что происходит. У меня было правило CSS, определяющее ширину тела: 

body {
    width: 900px;
}

Как только я изменил это на width: 100%; и заключил всю страницу в div шириной 900px, все заработало как положено.

Похоже, что IE использует элемент body для измерения верхнего и левого значений для offset(), но использует край окна, когда измеряет верхнее и левое расстояния при позиционировании элемента абсолютно.

Я надеюсь, что этот ответ спасет кого-то еще, все время, которое я потратил на это ...

...