@Deomid

Как сделать, чтобы цвет плавно менялся, когда прокручиваешь страницу?

Здравствуйте, помогите пожалуйста.
Как добиться такого цветового эффекта? calculit.piratesdeaudouce.com
Хочется, чтобы цвет плавно менялся, когда прокручиваешь страницу.
Заранее спасибо.
  • Вопрос задан
  • 497 просмотров
Пригласить эксперта
Ответы на вопрос 3
xtala
@xtala
Постигает Дзен
Используется библиотека Jquery color animate, если верить отладчику.
Вот здесь подробней:
https://jqueryui.com/animate/
З. Ы учитесь пользоваться браузерным дебагером, многие вопросы отпадут сами собой.
Ответ написан
Комментировать
Вот их код

var tabBgColor = ['#f13640', '#0096c8', '#89b600', '#9f5200', '#f6a11c', '#a539b5'];

	$(window).scroll(function () { 
		colorOnScroll();
	});
	colorOnScroll();

	function colorOnScroll(){
		var scrollTopValue = $(window).scrollTop();
		var tabSectionOffsetTop = [];
		$.each($(".filet"),function(k,v){
			var sectionOffsetTop = $(this).offset().top + ($(this).height() / 2);
			tabSectionOffsetTop.push(sectionOffsetTop);
		});
		if(scrollTopValue<tabSectionOffsetTop[0]){
			$('body').stop().animate({ backgroundColor: tabBgColor[0] });
		}else{
			for(var i=0; i<tabSectionOffsetTop.length;i++){
				if(scrollTopValue>tabSectionOffsetTop[i] && scrollTopValue<tabSectionOffsetTop[i+1]){
					$('body').stop().animate({ backgroundColor: tabBgColor[i+1] });
				}
			}
		}
	}
Ответ написан
@IsaevDev
самый кошерный вариант, мне кажется, привязать цвет к значению scrollTop
в вашем примере дошли до точки - поменяли
а лучше бы по ходу скролла менять плавно. и чем быстрее скролл - тем быстрее изменения. мне кажется это можно реализовать
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы