Хук "Кнопка наверх"

Posted 24 августа, 201212 yr

Интересует хук кнопки наверх, для возвращения к верху страницы. Нужна на jQuery с плавной прокруткой, никак не подружу IPB с jQuery noconflict :D

Цитата

25 августа, 201212 yr

comment_9257

JQuery не поддерживается IP.Board и никак подключить его нельзя.

Хук

Цитата

YOLO
1

14 сентября, 201311 yr

comment_43685

ребята, может кто подскажет как реализовать вот этои кнопочки "наверх" и "вниз", очень бы хотелось иметь такое..!
интересует подробное описание: путь к файлам и возможность подключения кодов.
автор утверждает что можно поставить на любой движок.

__magentawave.com/2013/01/scroll-page-up-and-down.html

модератор, если я что-то нарушил, указывая ссылку на другой ресурс - отредактируйте пожалуйста.

Edited 14 сентября, 201311 yr by WOLF

Цитата

19 сентября, 201311 yr

comment_44085

JQuery не поддерживается IP.Board и никак подключить его нельзя.

У себя подключил JQuery и зафигачил кнопку наверх.

ipb 345

Global Templates -> includeJS

<if test="minifyjs:|:$this->settings['use_minify']">
	<if test="remoteloadjs:|:$this->settings['remote_load_js']">
		<script type='text/javascript' src='<if test="usehttpsprototype:|:$this->registry->output->isHTTPS">https<else />http</if>://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js'></script>
		<script type='text/javascript' src='<if test="usehttpsprototype:|:$this->registry->output->isHTTPS">https<else />http</if>://ajax.googleapis.com/ajax/libs/prototype/1.7.1.0/prototype.js'></script>
		<script type='text/javascript' src='<if test="usehttpsscriptaculous:|:$this->registry->output->isHTTPS">https<else />http</if>://ajax.googleapis.com/ajax/libs/scriptaculous/1.8/scriptaculous.js?load=effects,dragdrop,builder'></script>
	<else />
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
		<script type='text/javascript' src='{$this->settings['js_base_url']}min/index.php?ipbv={$this->registry->output->antiCacheHash}&amp;g=js'></script>
	</if>
	<script type='text/javascript' src='{$this->settings['js_base_url']}min/index.php?ipbv={$this->registry->output->antiCacheHash}&amp;charset={$this->settings['gb_char_set']}&amp;f={parse expression="PUBLIC_DIRECTORY"}/js/ipb.js,cache/lang_cache/{$this->lang->lang_id}/ipb.lang.js,{parse expression="PUBLIC_DIRECTORY"}/js/ips.hovercard.js,{parse expression="PUBLIC_DIRECTORY"}/js/ips.quickpm.js<if test="hasjsmodules:|:count($jsModules)">,{parse expression="PUBLIC_DIRECTORY"}/js/ips.{parse expression="implode('.js,' . PUBLIC_DIRECTORY . '/js/ips.', array_unique( array_keys( $jsModules ) ) )"}.js</if>' charset='{$this->settings['gb_char_set']}'></script>
<else />
	<if test="nominifyremoteloadjs:|:$this->settings['remote_load_js']">
		<script type='text/javascript' src='<if test="nmusehttpsp:|:$this->registry->output->isHTTPS">https<else />http</if>://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js'></script>
		<script type='text/javascript' src='<if test="nmusehttpsp:|:$this->registry->output->isHTTPS">https<else />http</if>://ajax.googleapis.com/ajax/libs/prototype/1.7.1.0/prototype.js'></script>
	<else />
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
		<script type='text/javascript' src='{$this->settings['js_base_url']}js/3rd_party/prototype.js'></script>
	</if>
	<script type='text/javascript' src='{$this->settings['js_base_url']}js/ipb.js?ipbv={$this->registry->output->antiCacheHash}&amp;load=quickpm,hovercard,{parse expression="implode(',', array_unique( array_keys( $jsModules ) ) )"}'></script>
	<if test="nominifyremoteloadjs2:|:$this->settings['remote_load_js']">
		<script type='text/javascript' src='<if test="nmusehttpss:|:$this->registry->output->isHTTPS">https<else />http</if>://ajax.googleapis.com/ajax/libs/scriptaculous/1.8/scriptaculous.js?load=effects,dragdrop,builder'></script>
	<else />
		<script type='text/javascript' src='{$this->settings['js_base_url']}js/3rd_party/scriptaculous/scriptaculous-cache.js'></script>
	</if>
	<script type="text/javascript" src='{$this->settings['cache_dir']}lang_cache/{$this->lang->lang_id}/ipb.lang.js?nck={$this->settings['noCacheKey']}' charset='{$this->settings['gb_char_set']}'></script>
</if>
{parse template="liveEditJs" group="global"}
<if test="isLargeTouch:|:$this->registry->output->isLargeTouchDevice()">
<script type="text/javascript" src='{$this->settings['js_base_url']}js/3rd_party/iscroll/iscroll.js'></script>
</if>

<script type="text/javascript">
<!--
(function($){
	$(function(){var e = $(".scrollTop");
	var	speed = 500;
	e.click(function(){
		$("html:not(:animated), body:not(:animated)").animate({ scrollTop: 0}, speed);
		return false; 
	    });
	
	function show_scrollTop(){
		($(window).scrollTop()>250 )?e.fadeIn(1000):e.hide();
		}
		$(window).scroll( function(){show_scrollTop()} ); 
		show_scrollTop();
	});
})(jQuery)
//-->
</script>

И в ipb_styles.css у меня (правим под свое усмотрение)

/*кнопка вверх*/
a.scrollTop{
background: transparent url(путь до какртинки/стрелка.png') no-repeat center 50px;
display:block; width:5%; height:100%;
position:fixed; top:0px; left:0px;z-index:2000;
}
a.scrollTop:hover{opacity: 0.8;filter: alpha(opacity=80);}
/*-*/

ребята, может кто подскажет как реализовать вот этои кнопочки "наверх" и "вниз", очень бы хотелось иметь такое..! интересует подробное описание: путь к файлам и возможность подключения кодов.

там подробно описано, в принципе тоже самое, только не указали, что вначале надо jquery подключить.

Цитата

Lordbl4, Bichugan and DubininAlex
3

19 сентября, 201311 yr

comment_44087

забыл. В глобальный шаблон надо где нибудь поcле body добавить

Edited 19 сентября, 201311 yr by kgb

Цитата

23 сентября, 201311 yr

comment_44282

kgb, вот спасибки тебе добрый человек..!)) :yahoo: :dance: :good:

рано обрадовался.. что то не идёт у меня! не стукните в скайп если не трудно..! Skype: kolyan1972

или прикрепить свои файлы..

Цитата

24 сентября, 201311 yr

comment_44348

АЦ>Внешний вид>Мой стиль

1) первый код прописал в Global Templates после </head>
2) второй вставил в ipb_styles.css вниз перед /* Skin by www.ipbforumskins.com */
3) опять в Global Templates после </body>

путь к картинке прописал public/style_images/Snapshot/ups.png

ничего не появляется, что сделал не так?

Цитата

24 сентября, 201311 yr

comment_44349

АЦ>Внешний вид>Мой стиль

1) первый код прописал в Global Templates после </head>

2) второй вставил в ipb_styles.css вниз перед /* Skin by www.ipbforumskins.com */

3) опять в Global Templates после </body>

путь к картинке прописал public/style_images/Snapshot/ups.png

ничего не появляется, что сделал не так?

дай ссылку на форум посмотреть

Цитата

24 сентября, 201311 yr

comment_44350

<script type="text/javascript">
jQuery(document).ready(function() {

// Виджет кнопки вверх (Test-Templates)
// 1.0

jQuery('body').append('<div class="button-up" style="display: none;opacity: 0.7;width: 40px;height:100%;position: fixed;left: 0px;top: 0px;cursor: pointer;text-align: center;line-height: 30px;color: #d3dbe4;font-weight: bold;">▲ Вверх</div>');

jQuery (window).scroll (function () {
if (jQuery (this).scrollTop () > 100) {
jQuery ('.button-up').fadeIn();
} else {
jQuery ('.button-up').fadeOut();
}
});

jQuery('.button-up').click(function(){
jQuery('body,html').animate({
scrollTop: 0
}, 100);
return false;
});

jQuery('.button-up').hover(function() {
jQuery(this).animate({
'opacity':'1',
}).css({'background-color':'#e7ebf0','color':'#6a86a4'});
}, function(){
jQuery(this).animate({
'opacity':'0.7'
}).css({'background':'none','color':'#d3dbe4'});;
});

});
</script>

globalTemplate

Цитата

24 сентября, 201311 yr

comment_44351

отправил в личку!

Цитата

24 сентября, 201311 yr

comment_44352

во первых у тебя уже есть кнопка вверх, внизу форума, почему бы тебе не сделать ее копию с другим css?

JQuery не поддерживается IP.Board и никак подключить его нельзя.
Хук

Вы че тут рассказываете Все поддерживается, просто он работает в noconflict с другими идентификаторами.

Вот слева видите кнопку вверх, она на Jquery работает

Цитата

24 сентября, 201311 yr

comment_44353

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

Цитата

24 сентября, 201311 yr

comment_44355

<script type="text/javascript">
jQuery(document).ready(function() {

// Виджет кнопки вверх (Test-Templates)
// 1.0

jQuery('body').append('<div class="button-up" style="display: none;opacity: 0.7;width: 40px;height:100%;position: fixed;left: 0px;top: 0px;cursor: pointer;text-align: center;line-height: 30px;color: #d3dbe4;font-weight: bold;">▲ Вверх</div>');

jQuery (window).scroll (function () {
if (jQuery (this).scrollTop () > 100) {
jQuery ('.button-up').fadeIn();
} else {
jQuery ('.button-up').fadeOut();
}
});

jQuery('.button-up').click(function(){
jQuery('body,html').animate({
scrollTop: 0
}, 100);
return false;
});

jQuery('.button-up').hover(function() {
jQuery(this).animate({
'opacity':'1',
}).css({'background-color':'#e7ebf0','color':'#6a86a4'});
}, function(){
jQuery(this).animate({
'opacity':'0.7'
}).css({'background':'none','color':'#d3dbe4'});;
});

});
</script>

globalTemplate

этого кода нету у тебя на форуме

Попробуй кэш почистить

Цитата

22 января, 20159 yr

comment_79023

Так и не понял есть ли рабочий хук?

Цитата

Sign In

Хук "Кнопка наверх"

Featured Replies

Join the conversation

Последние посетители 0

Account

Navigation

Messages

Уведомления

Search