ロールオーバー

ロールオーバー

  • ボタン
  • ボタン
  • ボタン
JavaScript ▼
            window.onload = function(){
              for(var i=0 ; i<3; i++){
              node = document.getElementById("menu" + i)
              node.originalSrc = node.src;
              node.rolloverSrc = node.originalSrc.replace(".gif","_on.gif");
              node.onmouseover = function(){
                  this.src = this.rolloverSrc;
                };
                node.onmouseout = function(){
                  this.src = this.originalSrc;
                };
              };
            };
             
          
HTML ▼
            <ul class="rollover">
              <li><a href="#"><img src="btn1.gif" alt="ボタン" id="menu0" /></a></li>
              <li><a href="#"><img src="btn1.gif" alt="ボタン" id="menu1" /></a></li>
              <li><a href="#"><img src="btn1.gif" alt="ボタン" id="menu2" /></a></li>
            </ul>