Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 01.10.2010, 22:50
Новичок на форуме
Отправить личное сообщение для skulditsky Посмотреть профиль Найти все сообщения от skulditsky
 
Регистрация: 01.10.2010
Сообщений: 5

Animate свойств ScrollTop&ScrollLeft дергается
Страничка представляет собой большой фон (4000 на 2000), поверх которого абсолютно позиционированы картинки, навигация - "полет" над фоном к нужному месту через собственно Animate. Пробовал ScrollTo, LocalScroll, UI.Easing и т.п. распространенные вещи (суть одна и та же, все использую Animete, просто easing считается по другой формуле), даже изменял стандартный хардкодно зашитый в jquery тик с 13 мс на другие значение - все равно анимация оооочень не плавная. Не подскажите, в чем может быть дело?
Страничка: _http://vintage.skulditsky.kz
Ответить с цитированием
  #2 (permalink)  
Старый 01.10.2010, 23:42
Особый гость
Посмотреть профиль Найти все сообщения от monolithed
 
Регистрация: 02.04.2010
Сообщений: 4,260

По мне animate() по умолчанию все делает плавно.

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<style type="text/css">
div{
	background: red;
	position: absolute;
	left: 26%;
	width: 50px;
	height: 50px;
}
</style>

<script type="text/javascript">
$(function(){
	(function cub(){
		$('div').show('slow').animate({left:'+=350', opacity: 0.05},1500).animate({left:'-=350', opacity: 1},1500, cub);
	})();
});
</script>

<div></div>

Последний раз редактировалось monolithed, 01.10.2010 в 23:45.
Ответить с цитированием
  #3 (permalink)  
Старый 02.10.2010, 06:23
Новичок на форуме
Отправить личное сообщение для skulditsky Посмотреть профиль Найти все сообщения от skulditsky
 
Регистрация: 01.10.2010
Сообщений: 5

Да, конечно "обычно" animate делает все плавно, причем очень плавно 1000/13=77 fps, но в моем случае в адекватных браузерах все более-менее, но ИЕ - просто убивает дерганностью. На хабрахабре единственный совет был почитать вот этот топик Неплавная анимация скрытых элементов, но у меня нет скрытых элементов и паддинги/марджины у всего по нулям.
Ответить с цитированием
  #4 (permalink)  
Старый 02.10.2010, 10:15
Аватар для subzey
Пионэр
Отправить личное сообщение для subzey Посмотреть профиль Найти все сообщения от subzey
 
Регистрация: 16.11.2009
Сообщений: 1,322

Уменьшите количество элементов на странице, примерно вдвое-втрое, закомментируйте большие по размеру картинки и фоны. После этого попробуйте снова - станет ли лучше.
Ответить с цитированием
  #5 (permalink)  
Старый 02.10.2010, 10:19
Новичок на форуме
Отправить личное сообщение для skulditsky Посмотреть профиль Найти все сообщения от skulditsky
 
Регистрация: 01.10.2010
Сообщений: 5

Сообщение от subzey Посмотреть сообщение
Уменьшите количество элементов на странице, примерно вдвое-втрое, закомментируйте большие по размеру картинки и фоны. После этого попробуйте снова - станет ли лучше.
Попробовал убрать вообще всё Оставил только фон, даже без кнопок, задал delay-ми переходы - все равно в ИЕ дергается. Я думал, что проблема в каких-то элементах - но как выяснилось нет.
Также я попробовал в качестве картинки фона поставить не большое изображение, а замостить все каким-нибудь маленьким, т.е. страничка 4000 на 2000, фон - небольшое повторяющееся изображение, при "перелетах" все равно оччень сильно дергается.
Ответить с цитированием
  #6 (permalink)  
Старый 02.10.2010, 10:42
Особый гость
Посмотреть профиль Найти все сообщения от monolithed
 
Регистрация: 02.04.2010
Сообщений: 4,260

в jQuery я такое наблюдал если в активный элемент параллельно передаются какие-то данные, разберите все по строчкам и оставьте только нужное, а еще лучше и нужное перепишите
Ответить с цитированием
  #7 (permalink)  
Старый 02.10.2010, 10:45
Новичок на форуме
Отправить личное сообщение для skulditsky Посмотреть профиль Найти все сообщения от skulditsky
 
Регистрация: 01.10.2010
Сообщений: 5

Сообщение от monolithed Посмотреть сообщение
в jQuery я такое наблюдал если в активный элемент параллельно передаются какие-то данные, разберите все по строчкам и оставьте только нужное, а еще лучше и нужное перепишите
да, о том, что лучше не менять никаких свойств во время анимации я знаю. Данные никакие не передаются. Итак, что есть на странице:
Большой div с фоном 4000х2000, размером 4000х2000, z-index=1.
Пять абсолютно позиционированных картинок в разных местах странички, z-index=2, к ним должен осуществляться плавный переход. И всё, больше никаких наворотов. Насчет переписывания - уже ответил выше, убирал вообще все кроме непосредственно картинки. Т.е. body и один img оставались.
Ответить с цитированием
  #8 (permalink)  
Старый 02.10.2010, 11:01
Особый гость
Посмотреть профиль Найти все сообщения от monolithed
 
Регистрация: 02.04.2010
Сообщений: 4,260

4000х2000 - это гигантские размеры, если с изображениями меньшего размера все работает как надо, то попробуйте порезать на куски, а если еще и найдутся повторяющиеся элементы, то вообще будет просто собрать, только спрайтами выставляйте фон
Ответить с цитированием
  #9 (permalink)  
Старый 02.10.2010, 14:16
Новичок на форуме
Отправить личное сообщение для skulditsky Посмотреть профиль Найти все сообщения от skulditsky
 
Регистрация: 01.10.2010
Сообщений: 5

Сообщение от monolithed Посмотреть сообщение
4000х2000 - это гигантские размеры, если с изображениями меньшего размера все работает как надо, то попробуйте порезать на куски, а если еще и найдутся повторяющиеся элементы, то вообще будет просто собрать, только спрайтами выставляйте фон
Я уже пробовал (выше я писал, что вместо большой картинки пробовал ставить маленькие и очень маленькие) - эффект тот же. Тут затык именно в размере страницы, даже вообще без фонового элемента или каких либо изображений движения прерывистые, а эффект "полета" над фоном это основное что заказчик хочет видеть. Может кто в других фреймворках делал нечто подобное? Может в них не тормозит?
Ответить с цитированием
Ответ


Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Атрибуты свойств Dicot Общие вопросы Javascript 30 10.04.2014 11:09
Animate и IE greatilya jQuery 2 25.06.2010 11:10
Граница использования animate() Petka jQuery 6 02.03.2010 15:51
функция копирования свойств zzz Общие вопросы Javascript 44 17.08.2009 12:04
Как делать переменные имена свойств? khusamov Общие вопросы Javascript 2 04.08.2009 22:10