jQuery Back To Top Button by CodexWorld
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(window).scroll(function(){
if($(this).scrollTop() > 100){
$('#scroll').fadeIn();
}else{
$('#scroll').fadeOut();
}
});
$('#scroll').click(function(){
$("html, body").animate({ scrollTop: 0 }, 600);
return false;
});
});
</script>
<style type="text/css">
/* BackToTop button css */
#scroll {
position:fixed;
right:10px;
bottom:10px;
cursor:pointer;
width:50px;
height:50px;
background-color:#990066;
text-indent:-9999px;
display:none;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
}
#scroll span {
position:absolute;
top:50%;
left:50%;
margin-left:-8px;
margin-top:-12px;
height:0;
width:0;
border:8px solid transparent;
border-bottom-color:#ffffff
}
#scroll:hover {
background-color:#009900;
opacity:1;
filter:"alpha(opacity=100)";
-ms-filter:"alpha(opacity=100)";
}
</style>
<!-- BackToTop Button -->
<a href="javascript:void(0);" id="scroll" title="Sus" style="display: none;">Top<span></span></a>
<!-- ++++++++++++ Page Content Goes Here ++++++++++++ -->
</!doctype>
Niciun comentariu:
Trimiteți un comentariu
Lasa un comentariu