OKANOWEB WEB PARTS SAMPLE

Rollover Effects

この例では、7つの幅要素を持ちます、最初セットします。マウスが要素の一つの上に進むとき、それがクラス・ハイライトを使うようにされて。Internet Explorer 4.xの中の機能が可能にします：

• 現在、イベントは幅要素から生成されることができます。
  以前に、HTML著者は、正しいイベントを得るために各幅をアンカーで包まなければならないでした。
  
• イベントは平らな文書で捕らえられることができます。
  あなたは、効果に参加する各要素のために別々のイベント・ハンドラーをつくる必要がありません。

<style>
.Item {
cursor: hand;
font-family: ＭＳ　ゴシック;
font-size: 14;
font-style: normal;
background-color: green;
color: white
}
.Highlight {
cursor: hand;
font-family: ＭＳ　ゴシック;
font-size: 14;
background-color: white;
color: blue
}
A { text-decoration: none; }
</style>
 <script>
function rollon() {
if (window.event.srcElement.className == "Item") {
window.event.srcElement.className = "Highlight";
}
}
Rollover.onmouseover = rollon;
function rolloff() {
if (window.event.srcElement.className == "Highlight") {
window.event.srcElement.className = "Item";
}
}
Rollover.onmouseout = rolloff;
</script>
 <div id="Rollover">
 <a href="../../kyouka/index.html"><span class="Item"> 狂歌 /</span></a>
<a href="../../info/index.htm"><span class="Item"> 主張 /</span></a>
<a href="../../mopalink/index.htm"><span class="Item"> LINK /</span></a>
<a href="../../index.htm"><span class="Item"> Conputer /</span></a>
<a href="../../index.htm"><span class="Item"> TAG /</span></a>
<a href="http://homepage1.nifty.com/mopa/"><span class="Item"> MOPA-2 </span></a>
</div>