Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 31.10.2014, 16:11
Аспирант
Отправить личное сообщение для sloyi Посмотреть профиль Найти все сообщения от sloyi
 
Регистрация: 16.10.2014
Сообщений: 72

opacity и animate
Ребят подскажите пожалуйсата

есть код

$(window).scroll(function(){
	        var scrollTop = window.pageYOffset || document.documentElement.scrollTop;
	        if (scrollTop > 1000)
	            {
	            $("#hid").css("display","block");
	            $("#hid").animate({'opacity':'0.8'},1000);
	            }
	        if (scrollTop < 1000)
	            {
	            $("#hid").css("display","none");
	            $("#hid").css("opacity","0");
	            }
	 
	    });


<a id="a-hid" href="#logoTop">
<div id="hid" class="poyv-div"> </div>
</a>
[/html]


почему когда мы скролим на самый верх он ставит в свойство "opacity: " сначала 0 потом 0.8. а так все идеально работает за исключением вот этого бага а из за него последущая анимация не работает
Ответить с цитированием
  #2 (permalink)  
Старый 31.10.2014, 16:25
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,084

sloyi,
птому что animate останавливать надо
Ответить с цитированием
  #3 (permalink)  
Старый 31.10.2014, 16:28
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,084

sloyi,
$(window).scroll(function(){
	        var scrollTop = window.pageYOffset || document.documentElement.scrollTop;
	        if (scrollTop > 1000)
	            {
	            $("#hid").stop().css("display","block")
	            .animate({'opacity':'0.8'},1000);
	            }
	        else
	            {
	            $("#hid").stop().css({"display":"none", "opacity":"0"});
	            }

	    });
Ответить с цитированием
  #4 (permalink)  
Старый 31.10.2014, 16:38
Аспирант
Отправить личное сообщение для sloyi Посмотреть профиль Найти все сообщения от sloyi
 
Регистрация: 16.10.2014
Сообщений: 72

Вооо))0 спасибо работает

только щас понять не могу как сделать чтоб когда меньше тысячи он тоже плавно изчезал
Ответить с цитированием
  #5 (permalink)  
Старый 31.10.2014, 17:12
Аспирант
Отправить личное сообщение для sloyi Посмотреть профиль Найти все сообщения от sloyi
 
Регистрация: 16.10.2014
Сообщений: 72

я сделал следущим образом

var scrollTop =  document.documentElement.scrollTop;
		if (scrollTop > 1000)
			{
			$("#hid").stop().css("display","block")
			$("#hid").animate({'opacity':'0.8'},500);
			}
		else
	        {
	        $("#hid").stop()
			$("#hid").animate({'opacity':'0'},500);
	        }


но мне надо еще сделать чтоб display none ставил сразу как закончиться анимация не могу понять как. ставил и он либо нечего не делал либо ставил значение none сразу как происходит действие т.е. до того как закончилась анимация
Ответить с цитированием
  #6 (permalink)  
Старый 31.10.2014, 17:39
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,084

sloyi,
смотрите параметры animate и добавляйте css в callback, callback это функция которая выполнится когда анимация закончится
Ответить с цитированием
  #7 (permalink)  
Старый 31.10.2014, 18:05
Аспирант
Отправить личное сообщение для sloyi Посмотреть профиль Найти все сообщения от sloyi
 
Регистрация: 16.10.2014
Сообщений: 72

Спасибо большое все сделал)))
$(window).scroll(function(){
	    var scrollTop =  $(this).scrollTop();
		if (scrollTop > 300)
			{
			$("#hid").stop().css("display","block")
			$("#hid").animate({'opacity':'0.8'},500);
			}
		else
	        {
	        $("#hid").stop()
			$("#hid").animate({'opacity':'0'}, 500, function()
				{
				$("#hid").css("display","none");
				}
			);
	        }
	});
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Джава скрипт не работает в ie Yulia100207 Internet Explorer 28 14.05.2015 08:56
opacity и animate sloyi Общие вопросы Javascript 2 02.11.2014 22:55
название не придумал. Чуть подправит css Гробовщик (X)HTML/CSS 5 02.10.2013 13:55
Hint (Подсказка) на CSS devote Ваши сайты и скрипты 5 15.03.2013 03:10
Подружить два скрипта (скроллер+скрипт эффекта при наведении) Che jQuery 26 29.08.2012 10:59