Go Back   vb.org Archive > vBulletin Modifications > vBulletin 4.x Modifications > vBulletin 4.x Template Modifications
FAQ Community Calendar Today's Posts Search

Reply
 
Thread Tools
Create "Back to top" button using jQuery in one step. Details »»
Create "Back to top" button using jQuery in one step.
Version: 1.00, by xixxon xixxon is offline
Developer Last Online: Dec 2013 Show Printable Version Email this Page

Category: Miscellaneous Hacks - Version: 4.2.0 Rating:
Released: 07-29-2012 Last Update: Never Installs: 81
Re-useable Code Translations  
No support by the author.

Demo: http://noct-test.blogspot.com/2011/01/ai-duong.html

Instruction:
Find template footer.

Insert at the end.

Code:
<style type='text/css'>
#bttop{border:1px solid #4adcff;background:#24bde2;text-align:center;padding:5px;position:fixed;bottom:35px;right:10px;cursor:pointer;display:none;color:#fff;font-size:11px;font-weight:900;}
#bttop:hover{border:1px solid #ffa789;background:#ff6734;}
</style>
<div id='bttop'>BACK TO TOP</div>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>$(function(){$(window).scroll(function(){if($(this).scrollTop()!=0){$('#bttop').fadeIn();}else{$('#bttop').fadeOut();}});$('#bttop').click(function(){$('body,html').animate({scrollTop:0},800);});});</script>
Done. :up:
Hope you like it !

Show Your Support

  • This modification may not be copied, reproduced or published elsewhere without author's permission.
7 благодарности(ей) от:
davut_c20, dorans, elsa23, fxdigi-cash, Judith2, rodriiverduguez, seventhaxis

Comments
  #12  
Old 08-02-2012, 12:47 PM
xixxon's Avatar
xixxon xixxon is offline
 
Join Date: Jun 2007
Location: Việt Nam.
Posts: 126
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by BlueCheri View Post
Great, works fine

G!
5 stars if u like it
Reply With Quote
  #13  
Old 08-02-2012, 03:08 PM
Kraxell's Avatar
Kraxell Kraxell is offline
 
Join Date: Jun 2010
Location: Germany
Posts: 481
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Its the same like this:
https://vborg.vbsupport.ru/showthread.php?t=243771
Reply With Quote
  #14  
Old 08-02-2012, 05:09 PM
zascok zascok is offline
 
Join Date: Jul 2010
Posts: 146
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by sub_ubi View Post
Awesome mod we love it.

Just one problem with VB CMS on our home page its interfering with our slider vFCoders - Featured Content Slider Widget (was not able to change images/articles.

Is there an easy way to exclude/disable it from a page or url?
I don't really know what is the CMS variable as I have no suit. But if you can find it or hopefully someone will tell us just put it instead of calendar in the following

Code:
<vb:if condition="THIS_SCRIPT != 'calendar'">
The rest of the code for footer goes here
</vb:if>
Reply With Quote
  #15  
Old 08-02-2012, 10:00 PM
sub_ubi sub_ubi is offline
 
Join Date: Dec 2004
Posts: 177
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Its vbcms
Reply With Quote
  #16  
Old 08-04-2012, 12:40 PM
zascok zascok is offline
 
Join Date: Jul 2010
Posts: 146
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by sub_ubi View Post
Its vbcms
Then copy and paste this


Code:
<vb:if condition="THIS_SCRIPT != 'vbcms'">
<style type='text/css'>
#bttop{border:1px solid #4adcff;background:#24bde2;text-align:center;padding:5px;position:fixed;bottom:35px;right:10px;cursor:pointer;display:none;color:#fff;font-size:11px;font-weight:900;}
#bttop:hover{border:1px solid #ffa789;background:#ff6734;}
</style>
<div id='bttop'>BACK TO TOP</div>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>$(function(){$(window).scroll(function(){if($(this).scrollTop()!=0){$('#bttop').fadeIn();}else{$('#bttop').fadeOut();}});$('#bttop').click(function(){$('body,html').animate({scrollTop:0},800);});});</script>
</vb:if>
Reply With Quote
  #17  
Old 08-04-2012, 01:57 PM
xixxon's Avatar
xixxon xixxon is offline
 
Join Date: Jun 2007
Location: Việt Nam.
Posts: 126
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by zascok View Post
Then copy and paste this


Code:
<vb:if condition="THIS_SCRIPT != 'vbcms'">
<style type='text/css'>
#bttop{border:1px solid #4adcff;background:#24bde2;text-align:center;padding:5px;position:fixed;bottom:35px;right:10px;cursor:pointer;display:none;color:#fff;font-size:11px;font-weight:900;}
#bttop:hover{border:1px solid #ffa789;background:#ff6734;}
</style>
<div id='bttop'>BACK TO TOP</div>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>$(function(){$(window).scroll(function(){if($(this).scrollTop()!=0){$('#bttop').fadeIn();}else{$('#bttop').fadeOut();}});$('#bttop').click(function(){$('body,html').animate({scrollTop:0},800);});});</script>
</vb:if>
Thanks for supporting :up:
Reply With Quote
Благодарность от:
zascok
  #18  
Old 08-04-2012, 04:01 PM
zascok zascok is offline
 
Join Date: Jul 2010
Posts: 146
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by xixxon View Post
Thanks for supporting :up:
you are welcome. My turn to ask for a help. There is a small but annoying issue with the button.

When one opens the page at first the button is there, how to make it dissapear and appear only if one scrolled down a little. The very first time.

You see I gotta stop doing this. I mean asking then thinking lol

$('#bttop').hide()
Reply With Quote
  #19  
Old 08-05-2012, 12:37 AM
CrossWind CrossWind is offline
 
Join Date: Aug 2010
Posts: 19
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

hi

Please tell me how to make it work with VB3

thanks
Reply With Quote
  #20  
Old 08-05-2012, 01:25 AM
xixxon's Avatar
xixxon xixxon is offline
 
Join Date: Jun 2007
Location: Việt Nam.
Posts: 126
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by zascok View Post
you are welcome. My turn to ask for a help. There is a small but annoying issue with the button.

When one opens the page at first the button is there, how to make it dissapear and appear only if one scrolled down a little. The very first time.

You see I gotta stop doing this. I mean asking then thinking lol

$('#bttop').hide()
I will do it in the next update

Quote:
Originally Posted by CrossWind View Post
hi

Please tell me how to make it work with VB3

thanks
I don't use vBB3, so I can't test this
So sorry, anyone help him plz
Reply With Quote
Благодарность от:
CrossWind
  #21  
Old 08-08-2012, 09:17 PM
Arrogant-One's Avatar
Arrogant-One Arrogant-One is offline
 
Join Date: Jul 2007
Location: Brisbane
Posts: 196
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by CrossWind View Post
Thanks a nice idea
Code works fine with VB4

But does not work with VB3
Please tell me how to make it work with VB3

with my best regards
Would be better it if was more instantaneous. All it seems to do is scroll up to the top, not get you there ASAP!
Reply With Quote
Reply


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 03:06 PM.


Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2024, vBulletin Solutions Inc.
X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.04764 seconds
  • Memory Usage 2,346KB
  • Queries Executed 26 (?)
More Information
Template Usage:
  • (1)SHOWTHREAD
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (1)ad_showthread_beforeqr
  • (4)bbcode_code
  • (8)bbcode_quote
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)modsystem_post
  • (1)navbar
  • (4)navbar_link
  • (120)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (3)pagenav_pagelink
  • (11)post_thanks_box
  • (9)post_thanks_box_bit
  • (11)post_thanks_button
  • (1)post_thanks_javascript
  • (1)post_thanks_navbar_search
  • (3)post_thanks_postbit
  • (11)post_thanks_postbit_info
  • (10)postbit
  • (11)postbit_onlinestatus
  • (11)postbit_wrapper
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 

Phrase Groups Available:
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files:
  • ./showthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_post_thanks.php 

Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • showthread_start
  • showthread_getinfo
  • forumjump
  • showthread_post_start
  • showthread_query_postids
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • post_thanks_function_post_thanks_off_start
  • post_thanks_function_post_thanks_off_end
  • post_thanks_function_fetch_thanks_start
  • fetch_musername
  • post_thanks_function_fetch_thanks_end
  • post_thanks_function_thanked_already_start
  • post_thanks_function_thanked_already_end
  • post_thanks_function_fetch_thanks_bit_start
  • post_thanks_function_show_thanks_date_start
  • post_thanks_function_show_thanks_date_end
  • post_thanks_function_fetch_thanks_bit_end
  • post_thanks_function_fetch_post_thanks_template_start
  • post_thanks_function_fetch_post_thanks_template_end
  • postbit_imicons
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_display_complete
  • post_thanks_function_can_thank_this_post_start
  • pagenav_page
  • pagenav_complete
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • showthread_complete