返回顶部特效

返回顶部特效。本站演示。。。放在任意文件

<style type="text/css">
*{margin:0;padding:0;border:0;}
#retop{position:fixed;bottom:17%;_position:absolute;width:50px;height:50px;background:url(http://gaosky.com/assets/qblog/images/topback.png) no-repeat;text-indent:-9em;overflow:hidden;display:none;}
</style>
<script type="text/javascript" src="http://gaosky.com/assets/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	$('<a href="#" id="retop">返回顶部</a>').appendTo('body').fadeOut().click(function(){
		$(document).scrollTop(0);
		$(this).fadeOut();
		return false
	});
	var $retop = $('#retop');
	function backTopLeft(){
		var btLeft = $(window).width() / 2 + 478;
		if (btLeft <= 950){
			$retop.css({ 'left': 955 })
		}else{
			$retop.css({ 'left': btLeft }) 
		}
	}
	backTopLeft();
	$(window).resize(backTopLeft);
	$(window).scroll(function(){
		if ($(document).scrollTop() === 0){
			$retop.fadeOut()
		}else{
			$retop.fadeIn()
		}
		if ($.browser.msie && $.browser.version == 6.0 && $(document).scrollTop() !== 0){
			$retop.css({ 'opacity': 1 })
		} 
	});
});
</script>

2020-05-08 00:00:05 通过 网页 浏览(297)

共有0条评论!

发表评论

更换一道题!
回顶部