js实现回到顶部-创新互联
js脚本
创新互联建站主营华龙网站建设的网络公司,主营网站建设方案,app软件开发,华龙h5重庆小程序开发搭建,华龙网站营销推广欢迎华龙等地区企业咨询$(function() {
var scrollDiv = document.createElement('div');
$(scrollDiv).attr('id', 'toTop').html('^ 返回顶部').appendTo('body');
$(window).scroll(function() {
if ($(this).scrollTop() != 0) {
$('#toTop').fadeIn();
} else {
$('#toTop').fadeOut();
}
});
$('#toTop').click(function() {
$('body,html').animate({ scrollTop: 0 }, 800);
})
});
CSS样式
#toTop
{
width: 100px;
z-index: 10;
border: 1px solid #333;
background: #121212;
text-align: center;
padding: 5px;
position: fixed;
bottom: 0px;
right: 0px;
cursor: pointer;
display: none;
color: #fff;
text-transform: lowercase;
font-size: 0.9em;
}
另外可使用 插件 waypoint.js 滚动响应函数显示
带有iframe框架的滚动操作:
创新互联www.cdcxhl.cn,专业提供香港、美国云服务器,动态BGP最优骨干路由自动选择,持续稳定高效的网络助力业务部署。公司持有工信部办法的idc、isp许可证, 机房独有T级流量清洗系统配攻击溯源,准确进行流量调度,确保服务器高可用性。佳节活动现已开启,新人活动云服务器买多久送多久。
分享文章:js实现回到顶部-创新互联
文章源于:http://ybzwz.com/article/cohpes.html