动态设置Div坐标

时间：2022-01-22 13:18:11
<style type="text/css">

#main{text-align:center; background-color:#9FF; height:600px;width:800px}

#adver{

    position:absolute;

    left:50px;

    top:30px;

    z-index:;

}

</style>

<script src="js/scroll.js"></script>

</head>

<body>

<div id="adver"><img src="data:images/adv.jpg"/></div>

<div id="testDiv" style="position:absolute;left:300px;top:50px;background-color:red; width:80px; height:200px">内部样式的div</div>

<input   type="button"   value="测试内部样式坐标位置" onClick="test('testDiv')"/>

<input   type="button"   value="测试外部样式坐标位置" onClick="test('adver')"/>

<div id="main">网页内容</div>

</body>
function test (divID){

    var divObj=document.getElementById(divID);

    alert("left="+divObj.style.left+"\ntop="+divObj.style.top);  //只能读取style属性设置的值，不能读取其他如：内部样式、外部样式的值

    divObj.style.left=parseInt(divObj.style.left)++"px";

    divObj.style.top=parseInt(divObj.style.top)++"px";

}

动态设置Div坐标的更多相关文章

  1. JavaScript动态设置div的样式的方法

    有时候需要根据需要动态设置div的样式,当然对于稍有经验的javascript开发者来说,这一切都是那么的简单,但是对于初学者或者说没有相关经验的开发者来说可能就是一个不大不小的难关,下面就通过实例简 ...

  2. 网站图片列表动态显示、根据屏幕宽度动态设置DIV的CSS样式

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. js 动态设置 div 背景图片 并滚动显示

    var imgs =["../img/index/bgstyle/style1/index_top_bg2.jpg", "../img/index/bgstyle/sty ...

  4. Js 动态设置DIV日期信息

    HTML代码如下: <div  id="time"> 2013年12月20日 14:49:02 星期五 </div> JS代码如下: window.onlo ...

  5. &period;net mvc 设置div的动态部分视图内容 dynamic partial view

    示例效果:点击按钮,在div中 显示不同的partial view的内容 $("#btnEdit").click(function () { //动态获取相应的部分视图 var u ...

  6. JavaScript DOM编程基础精华03（动态设置&comma;层的操作&comma;性能问题）

    代码是否需要放置到onload中  //如果js代码需要操作页面上的元素,则将该代码放到onload里面.         //因为当页面加载完毕之后页面上才会有相关的元素 //如果js代码中没有操作 ...

  7. js动态添加Div

    利用JavaScript动态添加Div的方式有很多,在这次开发中有用到,就搜集了一下比较常用的. 一.在一个Div前添加Div <html> <body> <div id ...

  8. 基于Jquery UI的autocompelet改写，自动补全控件，增加下拉选项，动态设置样式，点击显示所有选项，并兼容ie6&plus;

    Jquery UI的autocompelete改写 注意:实现功能,除了原版的自动补全内容外,增加一个点击显示所有选项,样式能动态设置. 加载数据的来源为后台数据库读取. 具体代码如下: 引用 从官方 ...

  9. &lt&semi;video&gt&semi;标签：视频播放器动态设置src

    HTML代码 <div  id="my_div">    <video id="my_video"  width="600&quot ...

随机推荐

  1. github android

    作者:ruijun 链接:https://www.zhihu.com/question/37160415/answer/79569042 来源:知乎 著作权归作者所有,转载请联系作者获得授权. ### ...

  2. Kafka Shell基本命令（包括topic的增删改查）

    转载请注明出处:http://www.cnblogs.com/xiaodf/ 创建kafka topic 查看所有topic列表 查看指定topic信息 控制台向topic生产数据 控制台消费topi ...

  3. NOIP 2014&Tab;无线网络发射器选址

    水题..直接暴力 #include<cstdio> #include<algorithm> using namespace std; const int inf = 0x3f3 ...

  4. 使用Ubuntu 新建vpn过程

    1.更新软件源      sudo apt-get update   2.安装pip    sudo apt-get install python-pip   3.安装*    s ...

  5. redis 获取key 过期时间

    <pre name="code" class="html">127.0.0.1:6379> keys *b4f107c6-e96c-4a1e- ...

  6. HDU 4300 Clairewd’s message（扩展KMP）

    思路:extend[i]表示原串以第i開始与模式串的前缀的最长匹配.经过O(n)的枚举,我们能够得到,若extend[i]+i=len且i>=extend[i]时,表示t即为该点之前的串,c即为 ...

  7. AngularJS学习篇（九）

    AngularJS XMLHttpRequest $http 是 AngularJS 中的一个核心服务,用于读取远程服务器的数据. $http.get('someUrl',config).then(s ...

  8. rbac权限&plus;中间件

    1.权限组件rbac 1.什么是权限 1 项目与应用 2 什么是权限? 一个包含正则表达式url就是一个权限 who what how ---------->True or Flase 2.版本 ...

  9. js使用锚点回到顶部

    使用锚点链接是一种简单的返回顶部的功能实现.该实现主要在页面顶部放置一个指定名称的锚点链接,然后在页面下方放置一个返回到该锚点的链接,用户点击该链接即可返回到该锚点所在的顶部位置 <body s ...

  10. 如何把RabbitMQ卸载干净

    原文转载至:https://blog.csdn.net/w893932747/article/details/81018191 To uninstall RabbitMQ and Erlang fro ...

相关文章