Java-Script

　メニューを移動させる 　　　　　

Sample

ソース

<HTML>
<HEAD>
<TITLE>Java-Script</TITLE>
</HEAD>
<BODY bgcolor=white>
<FORM>
<INPUT TYPE=button VALUE="ウインドウを閉じる" onClick=window.close()>
</FORM>

<SCRIPT language="JavaScript">
<!--
function pullUp(docId, seqId) {
  var doc;
  doc = document.all(docId);
  doc.style.visibility = 'visible';
  doc.style.left = 0;
  doc.style.top = document.body.offsetHeight;
  contractIt(docId, seqId);
}
function contractIt(docId, seqId) {
  var doc;
  var x;
  var hasMoved;
  doc = document.all (docId);
  hasMoved = 0;
  if (seqId == yCurr) {
    if (parseInt(doc.style.left) != 0) {
      doc.style.left = parseInt(doc.style.left) * 0.2;
      hasMoved = 1;
    } 
    if (parseInt(doc.style.top) != 0) {
      doc.style.top = parseInt(doc.style.top) * 0.2;
      hasMoved = 1;
    } 
    if (hasMoved == 0) {
      yCurr = yCurr + 1;
    }
  }
  if (hasMoved == 1) {
    x = window.setTimeout('contractIt(\'' + docId + '\', ' + seqId + ')', 100);
  }
  else if (seqId > yCurr) {
    x = window.setTimeout('contractIt(\'' + docId + '\', ' + seqId + ')', 100);
  }
}
var x;
var n1;
var y;
n1 = new Date();
x = ((n1.getSeconds()) % 2);
y = 0;
yCurr = 0;
function mv_mnu(docId) {
  var dynHtml;
  var seqId;
  seqId = y;
  y = y + 1;
  dynHtml = ((navigator.appName == "Microsoft Internet Explorer") && 
(parseInt(navigator.appVersion) >= 4 ));
  if (dynHtml) {
    if (x >=0 && x < 4) {
      pullUp(docId, seqId);
    }
    x = (x + 1) % 4;
  }
}
// -->
</SCRIPT>

<B><SPAN id="mnu1;" style="position:relative; visibility:hidden;">
<A href="#">メニュー１</A></SPAN>

<SCRIPT language="JavaScript">
<!--
mv_mnu('mnu1;');
//--->
</SCRIPT>

<BR>
<SPAN id="mnu2;" style="position:relative; visibility:hidden;">
<A href="#">メニュー２</A></SPAN>

<SCRIPT language="JavaScript">
<!--
mv_mnu('mnu2;');
//--->
</SCRIPT>

<BR>
<SPAN id="mnu3;" style="position:relative; visibility:hidden;">
<A href="#">メニュー３</A></SPAN>

<SCRIPT language="JavaScript">
<!--
mv_mnu('mnu3;');
//--->
</SCRIPT>

<BR>
<SPAN id="mnu4;" style="position:relative; visibility:hidden;">
<A href="#">メニュー４</A></SPAN>

<SCRIPT language="JavaScript">
<!--
mv_mnu('mnu4;');
//--->
</SCRIPT>

<BR>
</BODY>
</HTML>

ワンポイント解説

<A href="#">　にリンク先を指定すれば、リンクします。
またこの機能は、メニューでけでなく文字の移動にも使えます。