吸顶菜单和置顶菜单
来源:互联网 发布:mix软件是什么 编辑:程序博客网 时间:2024/05/03 09:01
<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><style>body{margin: 0;padding: 0;padding-bottom: 5210px;}header{height: 100px;background-color:orange;width: 100%;text-align: center;}#menu{height: 40px;width: 100%;background-color:deepskyblue;text-align: center;}</style></head><body><header>吸顶菜单</header><div id="menu" onclick="returnback()">回到顶部</div><script>window.onscroll = function(){if(window.scrollY>=200){document.querySelector("#menu").style.position = "fixed";document.querySelector("#menu").style.left = "0";document.querySelector("#menu").style.top = "0";}else{document.querySelector("#menu").style.position = "static";}}function returnback(){var scrollTop = window.scrollY;var timi = setInterval(function(){scrollTop=scrollTop-50;window.scrollTo(0,scrollTop);if(scrollTop<=0){scrollTop=0;clearInterval(timi);}},10)}</script></body></html>
阅读全文
0 0
- 吸顶菜单和置顶菜单
- 吸顶菜单
- 顶部置顶菜单和CSS3分页
- Android菜单控件置顶悬浮
- Android 浮动置顶菜单实战
- paip.提升用户体验----置顶菜单
- pb window窗口去掉标题菜单,置顶
- html之置顶菜单-滚动到顶部
- Qt 前端显示(置顶)、 居中和右键菜单的实现
- 横向菜单和竖向菜单~
- 静态菜单和动态菜单
- 菜单
- 菜单
- 菜单
- 菜单
- 菜单
- 菜单
- 菜单
- PHP开发API
- Redis初探&基本命令(一)
- 数字图像学习笔记
- win8全角/半角切换
- 日期和时间命令使用
- 吸顶菜单和置顶菜单
- PP代码生成器(三) 设计freemarker模板, 创建解决方案
- Spark Streaming和Kafka整合开发指南(一)
- js—时间对象
- error LNK2019
- 2006 飞行员配对(二分图最大匹配)
- js正则替换字符串中的变量为变量的值
- redis命令
- hdu4268 Alice and Bob