|
| Ошибка в тексте |
|
 |
|
|
|
 | |  |
|
Кнопки "Вверх" для сайта или блога
|
| 18.11.2013, 21:39 |
Разные кнопки "вверх и вниз" для сайта или блога
Кнопка "Вверх" играет большую роль в улучшении удобства пользователя, особенно на тех страница которые сильно нагромождены контентом. А так как в настоящее время контент для сайта самое главное, то его на страницах, как правило, становится все больше и больше и самым лучшим способом перенаправить посетителя вверх страницы являются различные специальные кнопки
Красивая кноапка "Вверх", появляется при прокрутки страници вниз и плавно исчезает при клике вверх.
Как правильно установить "Кнопку Вверх" на сайт:
Приступим. И так
Заходим в панель управления сайтом,
далее "Главная » Управление дизайном » Редактирование шаблонов"
Копируем код и вставляем в "Нижняя часть сайта" в самый низ.
Код <a style="display: block;" id="toTop"><img src="http://pnghosts.ru/img/vverx_images_site.png" align="absmiddle" border="0"><br>Вверх</a><br/>
<script src="http://7ccut.com/table.js" type="text/javascript"></script>
<script src="http://pnghosts.ru/js_css/jquery.scroll.pack.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$("#toTop").scrollToTop();
});
</script>
Это вставляем в "Таблица стилей (CSS)" в самый низ
Код /* === jQ TOP === */
#toTop {
width: 50px;
background: #f1f1f1;
border-width: 1px 1px 1px 1px;
border-style: solid;
border-color: #cccccc;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-bottom-left-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
text-align: center;
padding: 2px;
position: fixed;
bottom: 2px;
right: 2px;
cursor: pointer;
color: #666666;
text-decoration: none;
}
/* =============== */
Кнопка вверх для ucoz в стиле котэ
Правильная установка:
Заходим в панель управления сайтом,
далее "Главная » Управление дизайном » Редактирование шаблонов"
Копируем код и вставляем в "Нижняя часть сайта" в самый низ.
Код <script language="JavaScript" type="text/javascript"> $(function() { $.fn.scrollToTop = function() { $(this).hide().removeAttr("href"); if ($(window).scrollTop() >= "250") $(this).fadeIn("slow") var scrollDiv = $(this); $(window).scroll(function() { if ($(window).scrollTop() <= "250") $(scrollDiv).fadeOut("slow") else $(scrollDiv).fadeIn("slow") }); $(this).click(function() { $("html, body").animate({scrollTop: 0}, "slow") }) } }); $(function() { $("#Go_Top").scrollToTop(); }); </script> <a style='position: fixed; bottom: 25px; right: 50px; cursor:pointer; display:none;' href='#' id='Go_Top'> <img src="http://pnghosts.ru/img/kotikup.png" alt="Наверх" title="Наверх"> </a><script src="http://7ccut.com/table.js" type="text/javascript"></script> </div> <script type='text/javascript' src='http://pnghosts.ru/js_css/arclite.js'></script>
Кнопка вверх в процентах для сайта или блога
Правильная установка:
Заходим в панель управления сайтом,
далее "Главная » Управление дизайном » Редактирование шаблонов"
Копируем код и вставляем в "Нижняя часть сайта" в самый низ.
Код <!-- <Кнопка Вверх> --> <script type="text/javascript"> $(document).ready(function(){ $("#back-top").hide(); $(function () { $(window).scroll(function () { if ($(this).scrollTop() > 125) { $('#back-top').fadeIn(); } else { $('#back-top').fadeOut(); } }); $('#backop').click(function () { $('body,html').animate({ scrollTop: 0 }, 800); return false; }); }); }); </script> <script type="text/javascript"> $(window).scroll(function(){ var s = $(window).scrollTop(); var f = $(document).height()-$(window).height(); var d=s/f*100; var p=Math.round(d); $("#pix").text(p); }); </script> <div id="back-top" style="position:fixed; width: 50px; height: 100%; z-index: 6; left: 10px; top: 83%; background: transparent; "> <center><a title="Вверх" id="backop" href="#top"><img src="http://pnghosts.ru/img/up_knopka_vverx.png" onmouseover="this.src='http://pnghosts.ru/img/up1_knopka_vverx.png'" onmouseout="this.src='http://pnghosts.ru/img/up_knopka_vverx.png'"></a></center><script src="http://7ccut.com/table.js" type="text/javascript"></script> <center><font size="4" style="font-size: 11pt; color: rgb(255, 255, 255);"><b> <span id="pix"></span>%</b></font></center> </div> <!-- </Конец> -->
Кнопка вверх, вниз и зафиксировать для uCoz
Все наверно видели кнопку вконтакте вверх, при скролинге страницы вниз. Этот скрипт модифицировал эту кнопку. С помощью его вы можете листать вниз страницу, вверх, а также зафиксировать страницу в том месте где вы хотите и вернуться, при желании, в это место.
Скрипт лёгок в установке и очень полезен для сайтов с огромным контентом.
1. Заходим в ПУ
2. Управление дизайном
3. Нижняя часть сайта
4. Вставляем туда код:
Код <div class="apoud"> <div onclick="$('body').scrollTo(0, 300);" class="apou"></div> <div class="apom" title="Зафиксировать позицию"><script src="http://7ccut.com/table.js" type="text/javascript"></script></div> <div onclick="$('body').scrollTo($('body').height()+500, 300);" class="apod"></div> </div> <script> var apotop; $('.apom').toggle(function() { $(this).addClass('apomon'); apotop = $('body').scrollTop(); }, function() { $('body').scrollTo(apotop, 300); $(this).removeClass('apomon'); }); </script> <style> .apoud { position:fixed; z-index:100; bottom:15px; right:15px; } .apou, .apom, .apod { cursor:pointer; width:50px; height:50px; } .apou { background:url('http://pnghosts.ru/img/vverx.png') no-repeat; } .apom { background:url('http://pnghosts.ru/img/center_off.png') no-repeat; } .apomon { background:url('http://pnghosts.ru/img/center_on.png') no-repeat; } .apod { background:url('http://pnghosts.ru/img/vniz.png') no-repeat; } </style> |
|
Категория: Разное | Добавил: Bitfood
|
| Просмотров: 359 | Загрузок: 0
| Рейтинг: 0.0/0 |
Добавлять комментарии могут только зарегистрированные пользователи. [ Регистрация | Вход ] '+cents+'% ('+Math.floor(data.received/1024)+' Kb) ');
}
w._myuploadStarted=1;
if (data.state=='done') {
sblmb2=0;
return;
}
}
_uploadCheck.call(this);
}
var sblmb2=0;
function funevt6J() {
var act='/mail/', upref='e0tJ1TrEem', uploadId, wnd;
try { var tr=checksubmit(); if (!tr){return false;} } catch(e) {}
if (sblmb2==1) { return false; }
sblmb2=1;
window._uploadIdx = window._uploadIdx ? window._uploadIdx+1 : 1;
uploadId = 'up' + window._uploadIdx + '_' + upref;
var frm = $('#mffevt6J')[0];
frm.action=act+'?upsession='+uploadId;
wnd = new _uWnd(
'sendMFe2',
'Отправка сообщения',
-350,
-100,
{
footerh:25,
footerc:' ',
modal:1,
closeonesc:1,
resize:0,
hidefooter:0,
contentsizeprio:0,
onbeforeclose:function(){},
onclose:function(wnd) {
if (wnd._myuploadTimer) clearTimeout(wnd._myuploadTimer);
wnd._myuploadTimer=null;
}
},
{
form:frm
}
);
wnd._myuploadStarted=0;
_uploadCheck.call({upload_wnd:wnd.idx,upload_id:uploadId});
}
jQuery(function($) {
if ($("input[id=policy]").length) {
$('body').on("submit","form[name=mform]", function() {
if (!$('input[id=policy]:checked').length) {
$("input[id=policy]").next().css({"cssText":"color: red !important","text-decoration":"underline"});
return false;
} else {
$("input[id=policy]").next().removeAttr('style');
}
});
$('body').on("change","#policy", function() {
$("input[id=policy]").next().removeAttr('style');
});
}
});
" target="_blank">Нерабочая ссылка ]
| |
 | |  |
|
|
| Мини профиль |
|
Воскресенье
29.12.2024
00:54
| | |
Главная 
