html 返回顶部 图片,jquery实现点击图片返回顶部

jquery实现窗口滚动条下拉，显示直达顶部的图片，点击图片返回顶部.

返回顶部

body {

height: 2000px;

}

img {

display: none;

}

.box {

position: relative;

height: 2000px;

}

div .wrap img {

position: fixed;

bottom: 10px;

right: 10px;

}

$(function(){

// 往下拉，出现广告框

$(window).scroll(function(){

var height = $(window).height();

// alert($(window).height());

if ($(window).scrollTop() >= height * 0.5) {

$("img").stop().fadeIn(1000);

} else {

$("img").stop().fadeOut(1000);

}

});

// 点击图片，图片滚动条立即回到顶端

$("img").click(function () {

$("html,body").stop().animate({

scrollTop: 0

},1500)

});

});

执行效果：

往下拖动鼠标，到达一定的位置，显示图片

往上托定滚动条到一定位置，图片消失

点击图片，回到顶部