how to add a thing that can make you go to top of page
+2
mist3r0us_b0y
Jack Atlas
6 posters
Page 1 of 1
how to add a thing that can make you go to top of page
how to add like this one http://prntscr.com/286gig it appear only on bottom of the page and if i click on it i got to top of page
Last edited by Jack Atlas on 7/12/2013, 08:00; edited 1 time in total (Reason for editing : soved)
Re: how to add a thing that can make you go to top of page
1. Go to Admin Panel>Display>Templates>general>overall_header
2. And add this code after <body> tag
2. And add this code after <body> tag
- Code:
<a style="position: fixed; bottom:5px;left:5px;" href="#" title="Back to Top"><img style="border: none;" src="https://cdn1.iconfinder.com/data/icons/tango/22x22/actions/go-top.png"/></a>
Re: how to add a thing that can make you go to top of page
Hello,
Add this to your javascript codes and tick all pages:
Add this to your javascript codes and tick all pages:
- Code:
$(function() {
$(window).scroll(function() {
if($(this).scrollTop() != 0) {
$('#dailytop').fadeIn();
} else {
$('#dailytop').fadeOut();
}
});
$('#dailytop').click(function() {
$('body,html').animate({scrollTop:0},500);
});
});
- Code:
#dailytop{
bottom: 50px;
color: #FFFFFF;
cursor: pointer;
display: none;
font-size: 14px;
opacity: 0.6;
padding: 8px;
position: fixed;
text-align: center;
z-index: 999;
right: 30px;
background-color : #000;
border-radius : 8px;
-webkit-border-radius : 8px;
-moz-border-radius : 8px;
}
#dailytop{
opacity : 0.9;
}
- Code:
<div id="dailytop">^ Back to Top</div>
Re: how to add a thing that can make you go to top of page
Of course you can use the above solution, or you can simply add 1 or 2 arrows (one up and one down) as widgets and do the same thing!
Image of result:
by adding this in a new widget:
And thats it!
Image of result:
by adding this in a new widget:
- Code:
<div style="position:fixed; right:0.1%; bottom:45%;">
<div id="nav_up"><img src="http://i56.servimg.com/u/f56/18/45/97/69/up11.png" alt="Go Up" title="Go Up" border="0"></div>
<div id="nav_down"><img src="http://i56.servimg.com/u/f56/18/45/97/69/down11.png" alt="Go Down" title="Go Down" border="0"></div>
</div>
<script type="text/javascript">
jQuery(function() {
var overelem = jQuery('body');
jQuery('#nav_up').fadeIn('slow');
jQuery('#nav_down').fadeIn('slow');
jQuery('#nav_down').click(
function (e) {
jQuery('html, body').animate({scrollTop: overelem.height()}, 1100);
}
);
jQuery('#nav_up').click(
function (e) {
jQuery('html, body').animate({scrollTop: '0px'}, 1100);
}
);
});
</script>
And thats it!
Re: how to add a thing that can make you go to top of page
Topic Solved & Archived.
Sanket- ForumGuru
- Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai
Similar topics
» how to make a floating text at the top of your page
» Make This Transparent (easiest thing ever)
» How do I make a certain page 404
» how to make a new page in my forums?
» How can I make Only 10 Topics In Each Page
» Make This Transparent (easiest thing ever)
» How do I make a certain page 404
» how to make a new page in my forums?
» How can I make Only 10 Topics In Each Page
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum