<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript" src="js/jquery-1.8.3.js" ></script>
<style>
.gotop{
width:50px;
height:50px;
background: darkred;
color: #fff;
font-size: 16px;
position: fixed;
right:20px;
bottom: 200px;
cursor: pointer;
display: none;
}
.gobottom{
width:50px;
height:50px;
background: darkred;
color: #fff;
font-size: 16px;
position: fixed;
right:20px;
bottom: 140px;
cursor: pointer;
display: none;
}
</style>
</head>
<body>
<div style="height:2000px;width:800px;margin:0 auto;background: green;">
</div>
<div class="gotop">
回到顶部
</div>
<div class="gobottom">
回到底部
</div>
</body>
<script>
function gotop(){
$(window).scroll(function(){
var s=$(window).scrollTop();
s>150 ? $(".gobottom,.gotop").css("display","block") : $(".gobottom,.gotop").css("display","none");
});
$(".gotop").live("click",function(){
$("html,body").animate({scrollTop:0})
})
var h=$("html").height();
$(".gobottom").live("click",function(){
$("html,body").animate({scrollTop:h})
})
}
gotop();
</script>
</html>
返回头部和底部，初始隐藏！
时间： 2024-10-11 06:07:00
返回头部和底部，初始隐藏！的相关文章
滑动ListView自动隐藏页面头部和底部元素的例子
完整工程代码在这:https://github.com/NashLegend/Auto-Hide-ListView 现在很多软件都有这种滑动列表的时候自动隐藏页面头部和底部元素的功能,比如Google+.在刚刚进入Activity的时候,页面是一个列表,底部有一个view,头部一个view,当列表向上滑动的时候,隐藏头尾元素,以显示更多内容,当列表向下滑动的时候,再将头尾元素拉出来.比如Google+. 刚刚进入时是这个样子: 再把列表身上一拉,头尾隐藏,成了这个样子: 再往下拉,就会再变回第一
HTML5 开发APP(头部和底部选项卡)
我们开发app有一定固定的样式,比如头部和底部选项卡部分就是公共部分就比如我在做的app进来的主页面就像图片显示的那样 我们该怎么实现呢,实现我们应该建一个主页面index.html,然后建五个子页面,通过mui来实现切换功能. 在index的html部分写下这样的代码 <body> <header class="mui-bar mui-bar-nav" style="padding-right: 15px;background: #00be68;"
ionic入门篇（一）[了解]与[头部、底部、副标题]
一].ionic了解:是什么?1.强大的 HTML5 应用程序开发框架(HTML5 Hybrid Mobile App Framework )2.构建接近原生体验的移动应用程序.3.注重外观.体验.交互4.轻量.速度快5.不支持IOS6和Android4.1以下的版本 特点:1.基于Angular语法2.轻量级.简单3.融合下一代移动框架,支持Angular.js特性,MVC,代码易维护4.漂亮.SASS.UI组件多5.原生性强6.ionic提供了强大的命令行工具7.性能优越,运行速度快 ion
html 如何引入一个公共的头部和底部
2016-01-08 作者案:尽己之力,用心打造一个商城!当你有十二分力气时,发现用了十分力气依旧没什么进展,请不要放弃希望:或许你想得到的东西正在十二分力气的地方等你:假若你用尽了十二分力气,还是没有得到,没什么可懊恼的呀,说明你用力的方向错了呗,(偷笑一个),是否觉得彼岸又离你近了一步? 我准备独立出头部和底部文件 界面用shtml 注意点:文件后缀名shtml 然后引用的文件路径有问题 参考文章地址: 做了两个公共的html页面:top.html和footer.html 一个index.
在html页面中引入公共的头部和底部
参考链接: http://www.cnblogs.com/jason-star/p/3345225.html http://blog.csdn.net/jsxzzliang/article/details/47022055 使用SHTML进行公共头部和底部的引用 SHTML介绍:shtml是一种基于SSI技术的文件,也就是Server Side Include--SSI 服务器端包含指令,一些Web Server如果有SSI功能的话就会对shtml文件特殊招待,服务器会先扫一次sht
jquery判断页面滚动条(scroll)是上滚还是下滚，且是否滚动到头部或者底部
项目背景 webtouch(webapp)页面,防苹果手机safari浏览器,网上滑动,底部导航消失,滑动到底部又出现.向下滑动,底部导航出现. 遇到问题 1.我一开始用swipeup和swipedown来做,发现因为有滚动条,不会触发.因此只能判断滚动条是上滚下滚等.关于手机手势,后面的文章会介绍,欢迎关注! 2.通过上滚下滚来让底部导航显示或者因此,安卓上面的浏览器都可以,但是苹果safari会一闪一闪,原因是苹果safari自动有个弹跳效果,导致事件重复执行,解决办法是给上滚下滚一个距离,
返回顶部和底部（动画）
<!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-
Ionic Js八：头部和底部
1.ion-header-bar 这个是固定在屏幕顶部的一个头部标题栏.如果给它加上'bar-subheader' 这个样式,它就是副标题. <ion-header-bar align-title="left" class="bar-positive"> <div class="buttons"> <button class="button" ng-click="doSomething(
jQuery类级别插件--返回顶部，底部，去到任何部位
先引入js:<script type="text/javascript" src="jquery.js" ></script><script type="text/javascript" src="towhere.js" ></script> 假设页面: <body> <a href="javascript:;" id="to-bo