logo помогаю бизнесу зарабатывать больше.
Связаться
Введите название услуги:

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

18 августа 2013 в 8:30 Без категории

На мой взгляд очень полезная вещь ” Кнопка вверх “. Делюсь с Вами этим очень простым в установке и красивым а работе скриптом.

Кому нужен, скопируйте ниже приведенный код в файл footer.php перед закрывающимся тегом </body> Вашей темы:

[php]

<div style= "position:fixed; right:0.1%; bottom:45%;" id="nav_up"><img src="https://my-soft.moy.su/_ld/12/61058142.png" alt="В верх страницы" title="В верх страницы" border="0"/></div>
<div style= "position:fixed; right:0.1%; bottom:41%;" id="nav_down"><img src="https://my-soft.moy.su/_ld/12/91749186.png" alt="В низ страницы " title="В низ страницы" border="0"/></div>

<script type="text/javascript">
jQuery(function() {
var overelem = jQuery(‘body’);

jQuery(‘#nav_up’).fadeIn(‘slow’);
jQuery(‘#nav_down’).fadeIn(‘slow’);

jQuery(‘#nav_down’).click(
function (e) {
jQuery(‘html, body’).animate({scrollTop: overelem.height()}, 800);
}
);
jQuery(‘#nav_up’).click(
function (e) {
jQuery(‘html, body’).animate({scrollTop: ‘0px’}, 800);
}
);
});
</script>
[/php]

Настройки скрипта:

Изначально скрипт имеет две кнопки “ вверх-вниз ”.

Если нужна только одна кнопка – ” вверх “, то код будет выглядеть так:

[php]
&lt;pre&gt;&lt;div style= "position:fixed; right:0.1%; bottom:45%;" id="nav_up"&gt;&lt;img src="https://site.ru/img1.png" alt="В верх страницы" title="В верх страницы" border="0"/&gt;&lt;/div&gt;

&lt;script type="text/javascript"&gt;
jQuery(function() {
var overelem = jQuery(‘body’);

jQuery(‘#nav_up’).fadeIn(‘slow’);
jQuery(‘#nav_down’).fadeIn(‘slow’);

jQuery(‘#nav_down’).click(
function (e) {
jQuery(‘html, body’).animate({scrollTop: overelem.height()}, 800);
}
);
jQuery(‘#nav_up’).click(
function (e) {
jQuery(‘html, body’).animate({scrollTop: ‘0px’}, 800);
}
);
});
&lt;/script&gt;
[/php]

где “https://site.ru/img1.png” – нужно заменить на адрес Вашей картинки.
Если Вы хотите Картинку Вконтакте и как у меня на сайте, тогда качайте Архив с Картинкой или рисуете свою кнопку.

<div style= "position:fixed; left:0.1%; bottom:0%;
 left:0.1%; - значит что кнопка находится с лева. Если хотим справа меняем на right.
bottom:45%; - значит что кнопка будет примерно по средине сайта. Если поставить 0%, будет как у меня, в самом низу.

Для меня скрипт очень удобеный.

Желаю удачи.

С уважением – Macsimus

Похожие статьи

Оставить заявку
По любым вопросам пишите мне в мессенджеры .
Написать в WhatsApp
+7 (925) 444-48-89
Написать в Telegram
@max_webs
Ваша цена
Предложите свою цена за товар или услугу. Пишите мне в мессенджеры или оставьте заявку в данной форме.
Написать в WhatsApp
+7 (925) 444-48-89
Написать в Telegram
@max_webs
[contact-form-7 id="22192" title="Универсальная форма"]
[contact-form-7 id="114828" title="Рассчитать стоимость"]