<style type="text/css">
#toTop
{
z-index:1030;
width: 50px;
height: 45px;
border: 2px solid #f7f7f7;
background: #f7f7f7;
text-align: center;
position: fixed;
bottom: 50px;
right: 10px;
cursor: pointer;
display: none;
color: #333;
opacity: 0.6;
filter: alpha(opacity=60);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-o-border-radius: 10px;
border-radius: 10px;
-webkit-transition: all .25s linear;
-moz-transition: all .25s linear;
-o-transition: all .25s linear;
transition: all .25s linear;
}
#toTop:hover
{
background: #b3b3b3;
border: 2px solid #b3b3b3;
}
*{outline:none;}
</style>
<script language="javascript">
$(document).ready(function(){
$('body').append('<div id="toTop"><img src="arrow-up.png"></div>');
$("#toTop").bind("click", function () {$("body,html").animate({ scrollTop: 0 }, 400);});
$(window).scroll(function () {
if ($(this).scrollTop() != 0) {
$('#toTop').fadeIn();
} else {
$('#toTop').fadeOut();
}
});
});
</script>
※ 화살표 이미지
