Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Перемещение по плоскости страницы onclick (https://javascript.ru/forum/events/17624-peremeshhenie-po-ploskosti-stranicy-onclick.html)

Vigilyanskiy 26.05.2011 15:38

Перемещение по плоскости страницы onclick
 
Подскажите, какой функцией воспользоваться для реализации следующего:
Весь сайт - одна страница, в отдельных ее частях присутствуют дивы с контентом. Необходимо чтобы при клике на ссылку вся страница плавно перемещалась в ту ее часть, где размещается соответствующий материал.

В принципе можно все это сделать прыгая по классам, но вот каким образом добиться плавного перехода??

Заранее спасибо за идеи..

poorking 26.05.2011 15:42

Основы программной анимации

Я так понял у вас огромная страница, и вам нужно ее скроллить в нужное место? В любом случае вам нужно анимировать какую-то величину, статья именно о том

Vigilyanskiy 26.05.2011 15:54

Вы правильно меня поняли.

Спасибо, сейчас посмотрю.

Vigilyanskiy 26.05.2011 16:27

Статья - супер, спасибо, но можем ли мы упростить данное решение путем перемещения по классам а не координатам?
В таком случае можно будет бесконечно (в разумных пределах) расширять поле страницы и добавлять новые точки, а не переписывать координаты в зависимости от количества добавленных блоков.

poorking 26.05.2011 16:42

Я такое не реализовывал, но как думаю это нужно делать:
Есть меню. К каждому элементу естественно привязан обработчик который должен скроллить к определенному блоку. И так каждый обработчик сначала должен вычислять координаты своего блока к которому он собирается скроллить, а потом собсна скроллить. так блоки можно будет менять местами, переставлять и добавлять. Я б какой нибудь интерфейс на JS написал перед тем как начать это делать, чтобы каждый раз в обработчике не писать строки отвечающие за вычисление координат. Чтоб связывать элементы меню с блоками было легко. Типа Scroller.assign(menuitem, target);
Координаты элемента на странице

Маэстро 31.05.2011 12:36

Цитата:

Сообщение от Vigilyanskiy (Сообщение 106252)
...В таком случае можно будет бесконечно (в разумных пределах) расширять поле страницы и добавлять новые точки...

К сожалению, вынужден Вас разочаровать. Идеей "бесконечного десктопа" (я её так называю) я занимался на практике. Сразу скажу о паре проблем.

1. Если у Вас на экране несколько графических элементов (например, размером 300x300), то управляя из javascript их координатами или даже скроллером плавного перемещения Вы не получите. Это будет рывками, с дерганием и мерцанием. Кроме того на некоторых компьютерах загрузка процессора будет доходить до 100%, что не всем понравится. Почему? Очевидно, потому что javascript-это интерпретатор, а не компилятор. И он выполняет перемещение на 1 px грубо говоря за 30 миллисекунд, а хотелось бы за 3 микросекунды. Другими словами "вылет реактивного самолета из-за угла" у Вас не получится (средствами Flash можно и в будущем, используя HTML5-Canvas).

2. Сколько всего предполагается элементов на странице? Попробуйте построить с помощью традиционных html-тегов
<table><tr><td></td></tr></table>
таблицу размером всего 1000 ячеек на 1000 строк. Броузер умрет.
Но я всё же нашел способ как решать такую задачу. Но это - тема целой отдельной статьи... и будущий проект :)


Часовой пояс GMT +3, время: 19:41.