Javascript.RU

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

Реализация добавления элементов при скролинге
Добрый день, подскажите пожалуйста как реализовать правильно поочередное появление элементов при scroll.
Суть проекта, страница о домашних животных, появилась идея, чтоб при прокрутке страницы, вслед за движением появлялись/исчезали отпечатки лап...
Пробую реализовать таким образом, ...делаю 4 блока с фоном виде отпечатков и абсолютным позицирнированием, потом вычисляю положение элемента возле которого они должны появлятся и в зависимости от его позиции добавляю их...правильно ли это решение?


$(document).ready(function(){
	$(document).scroll(function(){
	var div1 = document.getElementById('div-1'); 
    var rect = div1.getBoundingClientRect (); 
                x = rect.left;
                y = rect.top;
				if(y > 0 && y < 100){
	            $("div.lap2").animate({opacity:1}, 1200)
				}
				if(y < 0 && y < -100){
	            $("div.lap3").animate({opacity:1}, 1200)
	            }
				if(y < -100 && y < -200){
	            $("div.lap4").animate({opacity:1}, 1200)
	            }
				if(y < -200 && y < -300){
	            $("div.lap").css({top: 622,left: 158,opacity: 0});
				$("div.lap").animate({opacity:1}, 1200)
	            }	
                if(y < -300 && y < -400){
	            $("div.lap2").css({opacity: 0, top: 732 , left: 305});
	            }
				if(y < -400 && y < -500){
	            $("div.lap3").css({opacity: 0, top: 910, left: 299});
	            }
				console.log(" Left: " + x + "\n Top: " + y);
				
	   })
})


Зарание спасибо.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Проблемы в ИЕ при динамическом создании элементов Арсений Элементы интерфейса 5 20.08.2010 15:57
Добавление элементов при нажатии frolvict Общие вопросы Javascript 16 06.04.2010 19:56
Реализация скрипта. Изменение дерева при вводе каждой следующей буквы слова. WDha AJAX и COMET 0 04.11.2009 00:19
Кто чем пользуется при создании html элементов vflash Общие вопросы Javascript 14 24.08.2009 21:12
реализация добавления поля формы без перезагрузки sc2r2bey Элементы интерфейса 1 31.07.2009 16:51