Випуск Mac Safari 7 Rendering Issue scrollLeft () - javascript, jquery, safari, scroll

Я створив динамічну таблицю, яка прокручує ліворуч іправильно, має зміни розмірів стовпців, має фіксований заголовок тощо. Ця таблиця чудово працює у ВСІМ браузері, який я пробував. Навіть IE8 виглядає добре (відсутні функції, але все-таки добре).

Ця проблема виникає, коли я намагаюся переглянути таблицю в Safari 7.0.4 на своєму Macbook.

Додано те, що має виглядати (фіксований заголовок знаходиться внизу для демонстраційних цілей):

коли ви прокручуєте, фіксований заголовок, тіло та фіксовану смугу прокрутки підключаються через jQuery scrollLeft() функції (прокрутіть одну, прокрутіть усі):

var tableHeaderSpace = $(".table-full-wrap-space"),
tableHeader = $(".table-full-wrap-header"),
tableBody = $(".table-full-wrap-body"),
tableScroll = $(".table-full-wrap-scroll");

tableScroll.bind("scroll", function() {
tableHeader.scrollLeft(tableScroll.scrollLeft());
tableBody.scrollLeft(tableScroll.scrollLeft());
});

tableHeader.bind("scroll", function() {
tableScroll.scrollLeft(tableHeader.scrollLeft());
tableBody.scrollLeft(tableHeader.scrollLeft());
});

tableBody.bind("scroll", function() {
tableScroll.scrollLeft(tableBody.scrollLeft());
tableHeader.scrollLeft(tableBody.scrollLeft());
});

$(window).bind("scroll", function() {
var tableHeaderOffset = tableHeaderSpace.offset().top;
if (this.pageYOffset >= tableHeaderOffset) {
tableHeader.addClass("isFixed");
} else {
tableHeader.removeClass("isFixed");
}
});

Знову ж таки, це чудово працює ... але, коли ви прокручуєте трохи більше, браузер починає дублювати вміст у цьому фіксованому заголовку:

Проблема полягає в тому, що жоден "фактичний" вміст не дублюється - це якийсь фрагмент браузера, який показує дублікати - без додавання елементів у DOM.

Наступна картинка - це браузер, який робить ще "магію". у певних точках горизонтальної прокрутки цілі кольори фіксованого заголовка перевертаються:

Мені не вдалося отримати знімок, але він також раз копіював рядок "підрахунку записів" під ним.

Хтось має ідеї, що тут відбувається? Я намагався дублювати це в jsFiddle, але без кісток. З цього приводу я б припустив, що це проблема з моїм кодом, але результати є лише в ОДНОМ конкретному браузері на mac (safari), і він робить деякі елементи STRANGE.

Останнє зауваження - оскільки я не можу повторити це у jsFiddle, я не впевнений, як я можу повідомити про це Apple (працюючий (або «зламаний») приклад є власником, і я не можу надавати доступ до нього).

Редагувати: ось jsfiddle, де я спробував дублювати проблему (дуже грубо - але це функціонально):

jsFiddle Спроба копіювання

Відповіді:

0 для відповіді № 1

так - я знав, що це не буде гарячим питанням, але я подумав, що все-таки дам йому піти вперед.

що стосується відповіді, я знайшов старий css-файл таблиці, який перекривав мої нові речі - що, в свою чергу, якимось чином вигортало сафарі настільки погано, що його фрагментувало.

попередній старий код: background: transparent;

новий код: background: #fff;

Це не має для мене сенсу - але поки хтось не висуне гіпотезу, я зазначу це як відповідь.

тепер мій претендент номер один на найгірший браузер: сафарі - дивись, IE.

---