这个肯定是一起变化的。
<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
#aa{width:400px}
#bb{width:100%}
</style>
</head>
<body>
<div id="aa">
<div id="bb">#aa的宽为<span id="aaw">400</span><br>#bb的宽为<span id="bbw">0</span></div>
</div>
</body>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.min.js" type="text/javascript"></script>
<script>
$(function() {
function eleW() {
$("#aaw").text($("#aa").width()+"px")
$("#bbw").text($("#bb").width()+"px")
}
eleW()
$("#aa").width("800")
setTimeout(function() {eleW()},1000)
})
</script>
</html>
你好!!
你这是要修改样式的意思吧,是想通过javascript来控制样式么?
可以直接为元素设置style来达到你想要的效果。
//首先<div class="list_top">增加一个id标识,改为<div id="listTop" class="list_top">
<script>//在这里配置你的内容,对照你自己要的数值就好了
var config={
"_width":"960px",
"_height":"60px",
"_background":"#faa",
"_li_width":"",
"_li_height":"",
"_a_color":"yellow"
}
//初始化函数,将配置的数值,分别设置到元素中
function init(config){
var lstTop = document.getElementById("listTop")
lstTop.style.width = config["_width"]?config["_width"]:lstTop.style.width
lstTop.style.height= config["_height"]?config["_height"]:lstTop.style.height
lstTop.style.background= config["_background"]?config["_background"]:lstTop.style.background
var hot = document.getElementById("hottitle")
hot.style.width = config["_width"]?config["_width"]:hot.style.width
hot.style.height= config["_height"]?config["_height"]:hot.style.height
var ul = document.getElementById("ulid")
ul.style.width = config["_width"]?config["_width"]:ul.style.width
ul.style.height= config["_height"]?config["_height"]:ul.style.height
var lis = ul.getElementsByTagName("li")
for(var i=0i<lis.lengthi++){
lis[i].style.width = config["_li_width"]?config["_li_width"]:lis[i].style.width
lis[i].style.height= config["_li_width"]?config["_li_width"]:lis[i].style.height
var a = lis[i].getElementsByTagName("a")
a[0].style.color = config["_a_color"]?config["_a_color"]:a[0].style.color
}
}
window.onload = function(){
init(config)
}
</script>
编写相应程序代码即可。
代码如下:
<script>
function getInfo()
{
var s = ""
s += " 网页可见区域宽:"+ document.body.clientWidth
s += " 网页可见区域高:"+ document.body.clientHeight
s += " 网页可见区域宽:"+ document.body.offsetWidth + " (包括边线和滚动条的宽)"
s += " 网页可见区域高:"+ document.body.offsetHeight + " (包括边线的宽)"
s += " 网页正文全文宽:"+ document.body.scrollWidth
s += " 网页正文全文高:"+ document.body.scrollHeight
s += " 网页被卷去的高(ff):"+ document.body.scrollTop
s += " 网页被卷去的高(ie):"+ document.documentElement.scrollTop
s += " 网页被卷去的左:"+ document.body.scrollLeft
s += " 网页正文部分上:"+ window.screenTop
s += " 网页正文部分左:"+ window.screenLeft
s += " 屏幕分辨率的高:"+ window.screen.height s += " 屏幕分辨率的宽:"+ window.screen.width
s += " 屏幕可用工作区高度:"+ window.screen.availHeight
s += " 屏幕可用工作区宽度:"+ window.screen.availWidth
s += " 你的屏幕设置是 "+ window.screen.colorDepth +" 位彩色"
s += " 你的屏幕设置 "+ window.screen.deviceXDPI +" 像素/英寸"
//alert (s)
}
getInfo()
</script>