кнопка "вверх"

[Strigops]

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

Вот код:

Код: Выделить всё

<div style="position:fixed; right:1%; bottom: 40%;">
	<a href="#top" onclick="window.scrollTo(0,0); return false;">
	<img onmouseover="this.src='./styles/rosstan/theme/images/up2.png';" 

onmouseout="this.src='./styles/rosstan/theme/images/up1.png';" src="./styles/rosstan/theme/images/up1.png" border="0" alt="Up" 

name="a"></a>
	<br>
	<a href="#footer" onclick="window.scrollTo(0, 60000); return false;">
	<img onmouseover="this.src='./styles/rosstan/theme/images/down2.png';" 

onmouseout="this.src='./styles/rosstan/theme/images/down1.png';" src="./styles/rosstan/theme/images/down1.png" border="0" alt="Up" 

name="b"></a>
</div>

Могу дать свои стрелки (картинки), но если тебе нужна картинка вверх - то лучше сам нарисуй под свой стиль.

Сделал по твоей аналогии. Везде стрелки видны, только вот в Галерее вместо них две кракозябры видны. Хотя функцию свою они выполняют - при нажатии на них страница едет вверх/вниз. Может знает кто в чем проблема? Стрелки в самом низу по центру стоят. Вот ссылка на форум - http://siniy-popugay.ru/ , а вот сылка на галерею с кракозябрами - http://siniy-popugay.ru/gallery/index.php Сам код этих стрелок вставлен в футер.

[Strigops]

Все, вопрос снят. Надо было картинки стрелок закинуть еще и в папку с галереей.

[Alecto]

установил вот такой код

Код: Выделить всё

<!--Кнопки в верх в низ-->
<div style="position:fixed; right:0px; bottom: 40%;">
<a href="#top"><img src="/images/btn_top.png" alt="Вверх страницы" ></a>
<br/>
<a href="#bottom"><img src="/images/btn_bottom.png" alt="Вниз страницы" ></a>
</div>

Хочу сделать прокрутки плавными.
Когда-то дорогая Некстати помогала с этими вопросами.
Нашел работающий вариант ее кода:
<a href="" onclick="jQuery('#hidden_24').slideToggle('fast');return false;" >
И попробовал его адаптировать под свои нужды, сделав следующее:

Код: Выделить всё

<a href="#top" onclick="jQuery.slideToggle('fast');return false;">...</a>

но анимации не получилось. помогите плиз решить задачку.

[МайскийЖук]

Код: Выделить всё

<a href="" onclick="jQuery('#top').slideToggle('fast');return false;" >

Ы?

[Alecto]

не, не пашет.
#top - это, похоже, якорь на странице, а не идентификатор элемента. вот тут и возникает проблема.

Добавлено спустя 2 минуты 29 секунд:
чето мне кажется, там вообще другое надо использовать... типа animate

[МайскийЖук]

Ну, тогда вот так.

Код: Выделить всё

<a href="#top" onclick="jQuery.animate({scrollTop:0}, 'slow');return false;">

[Alecto]

пасиб.
заработало, только немножко подправил:

Код: Выделить всё

 onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');return false;"

а чтобы вниз, что надо менять здесь scrollTop:0 ?

Добавлено спустя 6 минут 43 секунды:
вместо 0 этот параметр $(document).height() не работает

[МайскийЖук]

Код: Выделить всё

<a href="#top" onclick="jQuery('html, body").animate({scrollTop: go_down.height()}, 'slow');return false;">

[Alecto]

перескакивает

[МайскийЖук]

Куда перескакивает? Кто перескакивает?

[Alecto]

scrollTop: go_down.height()

с этим параметром по нажатию кнопки страница перескакивает из текущего положения вниз, но плавной прокрутки нет.
наверное, высота страницы не правильно подставлено.

Добавлено спустя 2 минуты 45 секунд:
вот так заработало ))))))))))

Код: Выделить всё

<a href="#bottom" onclick="jQuery('html, body').animate({scrollTop:document.documentElement.scrollHeight}, 'slow');return false;">

Добавлено спустя 1 минуту 17 секунд:
МайскийЖук еще раз спасибо огромное за помощь!

[evrus01]

FomenkoAndrey, покажете результат?
Можно в личку.

[Пчелкин]

И мене... и меню...и мня... и нам тожеть...

[Alecto]

посмотреть результат можно здесь http://motobratva.com/index.php
кнопка справа посередине.

итоговый код

Код: Выделить всё

<!--Кнопки в верх в низ-->
<div style="position:fixed; right:0px; bottom: 45%;">
<a href="#top" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');return false;"><img src="/images/btn_top.png" alt="Вверх страницы" ></a>
<br/>
<a href="#bottom" onclick="jQuery('html, body').animate({scrollTop:document.documentElement.scrollHeight}, 'slow');return false;"><img src="/images/btn_bottom.png" alt="Вниз страницы" ></a>
</div>

делал под себя, но поменять оформления и подложить новые кнопочки - не проблема.

[Strigops]

Подскажите, пожалуйста, мне тупому, как подключается этот jQuery к форуму для того, чтоб движение страницы, при нажатии на стрелочку, было плавным. Или хотя бы дайте ссылку где это описано. Спасибо.