Это обновление вашего примера работает в Safari 5.1: http://jsfiddle.net/tGRf6/33/
Удаление overflow:hidden
из div#slider
решило проблему.Чтобы снова скрыть другие элементы слайда, я обернул еще один <div id="innerslider">
вокруг <ul>
и переместил свойство overflow:hidden
из <div id="slider">
в этот новый <div>
(плюс еще немного CSS).
Я бы все же (сначала поиск, а затем) выпустил отчет об ошибке с вашим примером jsfiddle, указав, что переполнение: скрытый, кажется, каким-то образом вовлечен.
Надеюсь, это поможет.
Прежде чем перейти к этому потенциальному решению (не тестировал в других браузерах, кроме Safari 5.1 и Firefox 7), я записал некоторые наблюдения:
Замена метода .animate () на простой JavaScriptиспользование setTimeout не изменило эффект.
Не анимированное изменение свойства left
работает, как и ожидалось, однако, с включенной картой, это всегда "1 щелчок позади" (сначалащелчок изменяет свойство на -800, но ничего не меняется, второй щелчок устанавливает его на -1600, но отображается средний ползунковый элемент и т. д.).
Уменьшение длительности анимации до20 усугубляет ошибку, так как «шаг пикселя» увеличивается за одну итерацию.Опять же, похоже, что последнее изменение не «проходит».Соответственно, при установке длительности на 800 (1 мс / px) элемент впоследствии отключается на один пиксель.
Увеличение / уменьшение значения left
в инструментах разработчика также показывает некоторыестранные эффекты, когда карта включена, например, при уменьшении на 2 ползунковый элемент сместился на 1 пиксель вправо, а затем назад на 1 пиксель влево.Все нормально, когда карта выбрасывается.
Удаление свойства «overflow: hidden» элемента div слайдера исправляет ошибку, но вам придется скрывать элементы слайдера другим способом (см.исправленный jsfiddle).
Очень похоже, что последнее изменение свойства left
не отражается на отображаемой странице, когда карта включена.