Source Code

Responsive back to top using jquery

Responsive back to top using jquery - css Example

Learn how to sumple create a button of "scroll back to top" button jquery with CSS.

About live24u.com – About Us


Welcome to live24u.com a blog my technologies blogs where you will learn about some Tips, Tricks and More…

In other words means other sens to say, it is a community type of new experiment and research or demo with example in It World (live24u).

live24u.com was founded in april, 2017 with the aim of all kind of sharing a place for some Tips, some about it related Tricks and Other very dificult Informer articles or new information for it technologies,tutorials and related solutions very expert level high solution in easy and simplified way that more helps our some Tricks and Tips community including like as Windows and server like as a linux and OS,Google,Google Adsense ,Fiver ,Upwork and How to Make Money Easy way to get basic ideas, learning and understandings.

This blog offers wide range of Tricks and Tips topics including Google, Google Adsense, How to Earn Money using Blogger or Website, Fiver and many more.

live24u.com is the right blog for anyone who is passionate about Earn or Make Money To Home without any InvestMent
of Tips and Tricks methodology.So, grab the opportunity and start learning today!



Why live24u.com?


  • Tremendous Opportunity for Growth
  • Equal Opportunity Every Person
  • Earn or Make Money To Home without any InvestMent
  • Open to New and Innovative Ideas


live24u – Goal


Hello! I am angular king and live24u is my web technologies blog. My specialities are Vuejs,API,angularjs,Vuejs,PHP, API, jQuery,Earn money,HTML,CSS eCommerce,JS,Laravel, CMS and bespoke web application development.



live24u says


We are Web Technology Experts and Team who provide you very Important information on Web Development information, Interview Questions and Answers, live project problem solution and their solution and online free tutorials – “live24u.com”.

Live Site



Thanks a lot....

Example : index.html



<body>
<!-- BackToTop Button -->
<a href="#" id="pagescroll" title="pagescroll to Top" style="display: none;">Top<span></span></a>

<h2>About live24u.com &#8211; About Us</h2>
<br/>
<p>Welcome to live24u.com  a blog my technologies blogs where you will learn about some Tips, Tricks and More&#8230;</p>
<p>In other words means other sens to say, it is a community type of new experiment and research or demo with example in It World (live24u).</p>
<p>live24u.com was founded in april, 2017 with the aim of all kind of sharing a place for some Tips, some about it related Tricks and Other very dificult Informer articles or new information for it technologies,tutorials and related solutions very expert level high solution in easy and simplified way that more helps our some Tricks and Tips community including like as Windows and server like as a linux and OS,Google,Google Adsense ,Fiver ,Upwork and How to Make Money Easy way to get basic ideas, learning and understandings.</p>
<p>This blog offers wide range of Tricks and Tips topics including Google, Google Adsense, How to Earn Money using Blogger or Website, Fiver and many more.</p>
<p>live24u.com is the right blog for anyone who is passionate about Earn or Make Money To Home without any InvestMent<br />
of Tips and Tricks methodology.So, grab the opportunity and start learning today!</p>
<br/><br/>
<h3>Why live24u.com?</h3>
<br/>
<ul>
<li>Tremendous Opportunity for Growth</li>
<li>Equal Opportunity Every Person</li>
<li>Earn or Make Money To Home without any InvestMent</li>
<li>Open to New and Innovative Ideas</li>
</ul>
<br/><br/>
<p><b>live24u &#8211; Goal</b></p>
<br/>
<p style="text-align: justify;">Hello! I am angular king and live24u is my web technologies blog. My specialities are Vuejs,API,angularjs,Vuejs,PHP, API, jQuery,Earn money,HTML,CSS eCommerce,JS,Laravel, CMS and bespoke web application development.</p>
<br/><br/>
<p><b>live24u says</b></p>
<br/>
<p>We are Web Technology Experts and Team who provide you very Important information on Web Development information, Interview Questions and Answers, live project problem solution and their solution and online free tutorials &#8211; &#8220;live24u.com&#8221;.</p>
<p><a href="http://live24u.com/" target="_blank" title="live24u" alt="live24u" class="download">Live Site</a></p>
</body>

Example : App.js


<script type='text/javascript'>
$(document).ready(function(){ 
	$(window).scroll(function(){ 
		if ($(this).scrollTop() > 100) { 
			$('#pagescroll').fadeIn(); 
		} else { 
			$('#pagescroll').fadeOut(); 
		} 
	}); 
	$('#pagescroll').click(function(){ 
		$("html, body").animate({ scrollTop: 0 }, 600); 
		return false; 
	}); 
});
</script>

Example : Style.css


<style type="text/css">

h1{font-size:45px;text-align:center; text-decoration:underline;}
h2{font-size:40px;color:#FA0530}
p{font-size:40px;}

#pagescroll {
position:fixed;
right:10px;
bottom:10px;
cursor:pointer;
width:50px;
height:50px;
background-color:#3498db;
text-indent:-9999px;
display:none;
-webkit-border-radius:60px;
-moz-border-radius:60px;
border-radius:60px
}
#pagescroll span {
position:absolute;
top:50%;
left:50%;
margin-left:-8px;
margin-top:-12px;
height:0;
width:0;
border:9px solid transparent;
border-bottom-color:#ffffff
}
#pagescroll:hover {
background-color:#e74c3c;
opacity:1;filter:"alpha(opacity=100)";
-ms-filter:"alpha(opacity=100)";}
</style>