达到一定高度,回到头部的代码

<script type="text/javascript">   $(window).scroll(function(){$(this).scrollTop()>400?$(".gotop-btn").css("display","block"):$(".gotop-btn").hide()})</script><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>返回顶部代码</title>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<style>
@charset "utf-8";
html, body, h1, h2, h3, h4, h5, h6, hr, p, pre, blockquote, dl, dt, dd, ul, ol, li, form, fieldset, legend, input, textarea, button, img { margin:0; padding:0; }
body, button, input, select, textarea { font:14px/1.8 "Microsoft Yahei", tahoma,arial,"Hiragino Sans GB", helvetica, sans-serif; }
img { border:0;}
.wraper { height:2000px; text-align:center; margin:0 auto; padding-top:20px; width:960px; background-color:#F7F7F7; font-size:22px; color:#FF0000; }
.gotop { position:fixed; right:50%; bottom:20px; margin-right:-580px; }
.gotop-btn { display:block; width:62px; height:52px; background:url(images/gotop.png) no-repeat 0 0; text-indent:-9999px; }
.gotop-btn:hover { background-position:0 -54px; }
</style>
<script type="text/javascript" name="jquery" src="js/jquery-1.8.3.js"></script>
</head>
<body>
<div class="wraper">鼠标往下滚动然后注意右下角,有惊喜!</div>
<div class="gotop">    <a href="javascript:document.body.scrollTop=0;document.documentElement.scrollTop=0;void(0);" class="gotop-btn" title="回到顶部" style="display:none; ">回到顶部</a></div>

<script type="text/javascript"> $(window).scroll(function(){$(this).scrollTop()>400?$(".gotop-btn").css("display","block"):$(".gotop-btn").hide()})</script>
</body>
</html>

时间: 2024-10-15 02:18:19

达到一定高度,回到头部的代码的相关文章

超好用的移动端布局自适应大小rem判断js文件及超过一定高度回到顶部按钮代码

//以下代码放到一个adapt.js文件当中 (function (doc, win) {   var docEl = doc.documentElement,     resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',     recalc = function () {       var clientWidth = docEl.clientWidth;       if (!clientWi

放在jsp头部的代码

String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; 一般放在jsp头部的代码,用于绝对路径.

XlistView3(头部的代码)

头部加载的代码 package com.example.listviewshangxia;import android.content.Context;import android.util.AttributeSet;import android.view.Gravity;import android.view.LayoutInflater;import android.view.View;import android.view.animation.Animation;import androi

获取网页高度和宽度的代码集合

function getInfo() { var s = ""; s += " 网页可见区域宽:"+ document.body.clientWidth+" "; s += " 网页可见区域高:"+ document.body.clientHeight+" "; s += " 网页可见区域宽:"+ document.body.offsetWidth + " (包括边线和滚动条的

回到顶部js代码

function go_to_top(){ //把内容滚动指定的像素数(第一个参数是向右滚动的像素数,第二个参数是向下滚动的像素数) window.scrollBy(0,-10); //延时递归调用,模拟滚动向上效果 scrolldelay = setTimeout('go_to_top()',5); //获取scrollTop值,声明了DTD的标准网页取document.documentElement.scrollTop,否则取document.body.scrollTop:因为二者只有一个会

写可測试的代码

写可測试的代码 不论什么一个软件都是能够測试.在某种意义上,用户的使用过程也就是一个软件測试的过程.但是这并非我们今天要讲的可測试性.我们讲的可測试性指的是代码的可測试性,通俗点儿说就是是一串代码里包括的逻辑是不是能够被单元測试所覆盖.在这篇文章里我会从单元測试的基本概念開始引伸到怎样写单元測试,怎样写可单元測试的代码.文章里全部的样例都是C#写的,一来它是我职业生涯的主力语言.二来C#广为人知,相信对广大职业的或是业余的程序猿来说读懂C#的代码不会是什么特别困难的事情.实际上我描写叙述的方法和

写可测试的代码

任何一个软件都是可以测试.在某种意义上,用户的使用过程也就是一个软件测试的过程.可是这并不是我们今天要讲的可测试性.我们讲的可测试性指的是代码的可测试性,通俗点儿说就是是一串代码里包含的逻辑是不是可以被单元测试所覆盖.在这篇文章里我会从单元测试的基本概念开始引伸到如何写单元测试,如何写可单元测试的代码.文章里所有的例子都是C#写的,一来它是我职业生涯的主力语言.二来C#广为人知,相信对广大职业的或是业余的程序员来说读懂C#的代码不会是什么特别困难的事情.实际上我描述的方法和概念并不会局限于C#或

关于代码调试de那些事

原文出处:http://www.wklken.me/posts/2014/11/23/how-to-debug.html 关于代码调试de那些事 1.你得明白你在做什么, 保持清醒 2.想清楚了再写代码 3.关于脚手架代码 4.写完一段代码第一时间自己review一下 5.review中注意, 代码是抠过来的么? 6.搞明白问题的表现是什么(症状) 7.调试过程中, 需要时刻注意 8.环境/数据一致性 9.先不要动代码, 假设代码是正确的 10.首先要怀疑自己 11.对于莫名其妙的问题, 多试几

CSS 代码技巧与维护 ★ Mozilla Hacks – the Web developer blog

原文链接:https://hacks.mozilla.org/2016/05/css-coding-techniques/ 译文链接 :http://www.zcfy.cc/article/css-coding-techniques-x2605-mozilla-hacks-8211-the-web-developer-blog-1244.html 最近,我发现许多人被CSS难倒,无论是新手还是有经验的开发者.自然地,他们就希望能有一种更好的语言来代替它,CSS预处理器就是从这种想法中诞生的.一些