<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf8" />
<link rel="stylesheet" type="text/css" href="/static/demo/html/css/cc.css" />
<script type="text/javascript" src="/static/demo/html/css/cs.js"></script>
<script type="text/javascript">
<!--
function test_demo_val(strValue)
{
var strId="MyDIV"
document.getElementById(strId).style.opacity=strValue;
document.getElementById("CodeValue").innerHTML=strValue;
}
//-->
</script>
<style>
#MyDIV
{
border:1px solid black;
background-color:lightblue;
width:200px;
height:100px;
position:relative;
left:50px;
padding:5px
}
#DIV2
{
border:1px solid black;
background-color:yellow;
width:200px;
height:100px;
position:relative;
top:80px;
left:20px;
padding:5px
}
div#MyDIV
{
opacity:0.9;
}
</style>
</head>
<body>
<!--wrapper-->
<div id="wrapper">
<div id="SelArea">
<h2>CSS 属性：</h2>
<h3>opacity:</h3>
<form action="javascript:return false;">
<ul>
<input type="hidden" id="PreSelectedValue" value="" />
<li><input autocomplete="off" type="radio" name="rpos" onClick="test_demo(this)" id="value_1" value="0.9" checked="checked" />0.9</li>
<li><input autocomplete="off" type="radio" name="rpos" onClick="test_demo(this)" id="value_2" value="0.8" />0.8</li>
<li><input autocomplete="off" type="radio" name="rpos" onClick="test_demo(this)" id="value_3" value="0.7" />0.7</li>
<li><input autocomplete="off" type="radio" name="rpos" onClick="test_demo(this)" id="value_4" value="0.6" />0.6</li>
<li><input autocomplete="off" type="radio" name="rpos" onClick="test_demo(this)" id="value_5" value="0.5" />0.5</li>
<li><input autocomplete="off" type="radio" name="rpos" onClick="test_demo(this)" id="value_6" value="0.4" />0.4</li>
<li><input autocomplete="off" type="radio" name="rpos" onClick="test_demo(this)" id="value_7" value="0.3" />0.3</li>
<li><input autocomplete="off" type="radio" name="rpos" onClick="test_demo(this)" id="value_8" value="0.2" />0.2</li>
<li><input autocomplete="off" type="radio" name="rpos" onClick="test_demo(this)" id="value_9" value="0.1" />0.1</li>
<li><input autocomplete="off" type="radio" name="rpos" onClick="test_demo(this)" id="value_10" value="1" />1</li>
</ul>
</form>
</div>
<div id="result">
<h2>结果：</h2>
<div id="DemoArea">
<div id="DIV2"><br/><br/><br/>一个黄色的 DIV 元素。</div>
<div id="MyDIV"><br/><br/><br/>改变 MyDIV 的不透明度。</div>
</div>
<h2>CSS 代码：</h2>
<pre id="CodeArea">
div#MyDIV
{
opacity:<span id="CodeValue">0.9</span>;
}
</pre>
</div>
</div><!--wrapper End-->
</body>
<script type="text/javascript">tiy_onload()</script>
</html>
