構文 |
|
| document.属性.listStylePosition = "表示位置" ［DOM属性］ |
表示位置 |
|
| inside | outside |
|
|
説明
- スタイルシート内のリストの表示位置を値に持つ。後から「listStylePositione」属性に値を設定することで，表示位置を変更することも可能。
- 設定できる値のうち「inside」は内側，「outside」は外側となる。
- スタイルシートでは，「list-style-position」プロパティにあたる。
- 用例では，ボタンをクリックした時，id名「STY」を設定したdiv要素のリストの表示位置の値を変更することで，リスト表示の表示位置を変更している。
- Internet Explorerは，バージョン5以降で対応。
用例
ボタン・フォームをクリックした時「listStylePositione」属性に値を設定することにより，id名「STY」を設定したul要素内にあるリストの表示位置が変わる。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>listStylePosition</title>
<script type="text/javascript">
<!--
function SList(VALUE){
if(document.getElementById){
document.getElementById("STY").style.listStylePosition = VALUE
}
}
//-->
</script>
<style type="text/css">
<!--
body { background-color: #ffffff; }
-->
</style>
</head>
<body>
*リストの位置
<hr>
<form>
<input type="button" value=" inside " onClick="SList('inside')">
<input type="button" value=" outside " onClick="SList('outside')">
</form>
<hr>
<ul>
<li>リストA</li>
</ul>
<ul id="STY">
<li>リスト1</li>
<li>リスト2</li>
<li>リスト3</li>
</ul>
<ul>
<li>リストB</li>
</ul>
</body></html>
この用例を実行する
