За последние 24 часа нас посетили 26523 программиста и 1511 роботов. Сейчас ищет 851 программист ...

Дрожание анимации

Тема в разделе "JavaScript и AJAX", создана пользователем Freakmeister, 6 май 2012.

  1. Freakmeister

    Freakmeister Активный пользователь

    С нами с:
    20 дек 2009
    Сообщения:
    888
    Симпатии:
    5
    Пытаюсь сделать в шапке кнопки в виде двигающихся картинок. Столкнулся с проблемой дрожания этих самых картинок при анимации. Сделал очень простой скрипт:
    http://maestro-magnifico.ru/testdir/2012-05-06/image-slider.php
    Более-менее безглючно оно работает только в фаерфоксе, в хроме и особенно в IE возникает сильное дрожание. Ежели кто сталкивался с подобным извращением, подскажите плз как это можно сделать более плавно.
     
  2. YSandro

    YSandro Старожил

    С нами с:
    7 апр 2011
    Сообщения:
    2.523
    Симпатии:
    2
    По умолчанию в функции animate стоит тип движения "swing", нужно поставить "linear".

    Ты вызываешь анимацию так
    Код (Text):
    1. .animate( properties [, duration] [, easing] [, complete] )
    , попробуй так
    Код (Text):
    1. .animate( properties, options )
    - в options тоже передать объект:
    Код (Text):
    1. {easing:'linear',duration:300}
     
  3. Freakmeister

    Freakmeister Активный пользователь

    С нами с:
    20 дек 2009
    Сообщения:
    888
    Симпатии:
    5
  4. YSandro

    YSandro Старожил

    С нами с:
    7 апр 2011
    Сообщения:
    2.523
    Симпатии:
    2
    Если посмотреть Файребагом, то видно, что при пересечении курсором границы картинок, меняется положение обоих картинок. Это и есть видимое дрожание.
    Так что проблема не с jquery, а с реализацией.
     
  5. Freakmeister

    Freakmeister Активный пользователь

    С нами с:
    20 дек 2009
    Сообщения:
    888
    Симпатии:
    5
    Окей.) Есть идеи как можно исправить? У меня ещё была идея сделать у элементов списка фиксированную ширину в 150px и наложить их друг на друга через z-index, а потом уже менять width. Но такая реализация мне показалась более кривой.)

    //add
    Проехали, воспользовался плагином Accordionza. Получилось не совсем то, что я задумывал, но по крайней мере без дрожания.