JS简单实现DIV相对于浏览器固定位置不变的方法
作者：hbiao68 发布时间：2023-08-05 22:30:12
标签：JS,DIV,固定位置
本文实例讲述了JS简单实现DIV相对于浏览器固定位置不变的方法。分享给大家供大家参考，具体如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<html>
<head>
<title>Anchor Properties</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta content="noindex, nofollow" name="robots">
<script>
function Totop(){
window.scrollTo(0,0);
}
function bottom(){
//scrollHeight属性是获取对象的滚动高度。
window.scrollTo(0,document.body.scrollHeight);
}
function left(){
//alert("left");alert(document.body.scrollLeft)
var left = 0-document.body.scrollWidth;//向左移动的像素
window.scrollBy(left,0 );
}
function right(){
//alert(document.body.scrollWidth);
//整个滚动条的宽度
window.scrollBy(document.body.scrollWidth,0);
}
function init(){
var init_pos=oLayer.style.posTop ;
var init_left=oLayer.style.posLeft;
document.body.onscroll=function(){
//document.body.scrollTop等于滚动滑块上端离滚动的开始点的距离
oLayer.style.posTop=document.body.scrollTop+init_pos;
//scrollLeft设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
oLayer.style.posLeft=document.body.scrollLeft +init_left;
}
}
</script>
</head>
<body onload="init()">
<a onclick="bottom()">置底</a>
<div id="oLayer" style="position:absolute;left:120;top:60;z-index:2;background:green;width:120px;height:120px"> ddddd
</div>
<br>
<a onclick="right()">置 右</a>
<div style="width:1500px;height:30px;float:left">width="2000px"</div>
<a style="float:right" onclick="left()">置 左</a>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><a onclick="Totop()">置 顶</a>
</body>
</html>
希望本文所述对大家JavaScript程序设计有所帮助。
0
投稿猜你喜欢
1.画最简单的直线图代码如下：import numpy as np import matplotlib.pyplot as plt x=[0- 在编写Web自动化测试用例的时候，如何写断言使新手不解，严格意义上来讲，没有断言的自动化脚本不能叫测试用例。就像功能测试一样，当测试人员做了
- 单表的唯一查询用：distinct多表的唯一查询用：group bydistinct 查询多表时，left join 还有效，全连接无效，在
- 需求：从一台Oracle数据库获取数据，本以为是很简单的事情，直接将原来的SqlClient换成OracleClient调用，结果远没自己想
- 一、私有化上篇说过封装，既将我们不想让别人看到代码的内容，但是又需要用到的内容，通过类内部调用来实现调用。说到这里却不得不提一下上篇的：cl
- 1. 前言最近打算做一批日历给亲朋好友，但是从 iPhone 上导出的照片格式是 HEIC 格式，而商家的在线制作网站不支持这种图片格式PS
- 假设，你现在维护一个支持邮箱登录的系统，用户表是这么定义的：create table SUser( ID bigint unsig
- 处理数据时，经常需要对索引进行处理，那么可以通过set_index和reset_index来进行处理官方文档DataFrame.set_in
- /** 2 * 检索数组元素（原型扩展或重载） 3 * @param {o} 被检索的元素值 4 * @type int 5 * @retu
- 一、前言当我们在django中添加或修改了数据库model后，一般需要执行makemigrations、migrate把我们的model类生
- 1. 抓取街拍图片街拍图片网址2. 分析街拍图片结构keyword: 街拍pd: atlasdvpf: pcaid: 4916page_nu
- 介绍SQLSERVER 2012新增了两个字符串函数CONCAT和FORMAT。本文首先介绍一下CONCAT，CONCAT函数的作用是可以返
- 平时在写asp代码的时候有很多重复的内容要写，麻烦的要命，比如在收集表单提交的数据时，特别是表单的输入域比较多时，要不断写好多的reques
- 前些天有位网友建议我在博客中添加RSS订阅功能，觉得挺好，所以自己抽空看了一下如何在Django中添加RSS功能，发现使用Django中的s
- 获取 系统时间 函数“NOW()” 函数 能够获得当前系统日期和时间，格式如下：&ldquo
- 一个老程序员，各种开发语言和技术都有涉及。每
- 在工作实践和学习中，如何开启 MySQL 数据库的远程登陆帐号算是一个难点的问题，以下内容便是在工作和实践中总结出来的两大步骤，能帮助DBA
- 现在我们用python代码实现感知器算法。# -*- coding: utf-8 -*-import numpy as npclass Pe
- 阅读上一篇：W3C优质网页小贴士（一） 使用 alt 属性描述每幅图像alt 属性有什么用？alt 属性可以在一系列标签中使用（如
- 在这个自动化时代，我们有很多重复无聊的工作要做。 想想这些你不再需要一次又一次地做的无聊的事情，让它自动化，让你的生活更轻松。 那么在本文中
