..



 ■HomeJavaScriptサンプル集〔インタラクティブ編〕−ウインドウ制御(スクロール窓)

JavaScript 無料のフリースクリプト集...
..
スクロール窓

 スクロールする窓を作成します。ポップアップウインドウでも実行できます。任意のHTMLファイルをスクロールさせることができます。スクロールさせる文字や画像からリンクすることもできます。HPのコンテンツを宣伝したりスタッフロールを作成できます。



 HPでの使用方法
1.<head>〜</head>タグ間の編集

 スクロールさせるHTMLファイルの<head>〜</head>タグ間に次のスクリプトを挿入してください。スクロールするY軸は青色の数字で変えることができます。緑色の数字でスクロールする早さを変更することができます。

<script language="JavaScript"><!--
wy=0;
if(document.getElementById){wmax=1600;}// ネスケ6〜
if(document.all){wmax=1500;}//IE4〜
winScroll();
function winScroll()
{
   wy++;
   window.scrollTo(0,wy);
   if(wy>wmax){wy=0;}
   setTimeout("winScroll()",5);
}
// --></script>


2.使い方

 2−1.ページ内に表示させる場合
  ページ内にスクロールさせる窓を作る場合は次のHTMLを表示させたい部分に挿入します。青色の数字で窓の大きさを変えることができます。枠を表示させない場合は緑色の数字を「0」にします。

<iframe src="scrollスクリプトを埋め込んだHTMLファイル名.html" width="160" height="152" frameborder="1" scrolling="no"></iframe>

 2−2.ポップアップウインドウに表示させる場合
  ポップアップウインドウに表示させる場合は直接HTMLファイルにリンクしてください。ポップアップウインドウの大きさや座標の設定は入門編の「新しいウインドウを開く、閉じる」を参照してください。

3.サンプルの解説
<html>
<head>
<title>スクロール</title>
<script language="JavaScript"><!--
wy=0;
if(document.getElementById){wmax=1600;}// ネスケ6〜
if(document.all){wmax=1500;}//IE4〜
winScroll();
function winScroll()
{
   wy++;
   window.scrollTo(0,wy);
   if(wy>wmax){wy=0;}
   setTimeout("winScroll()",5);
}
// --></script>

</head>
<body style="color:rgb(80,80,80);">
<div align="center">
<br><br><br><br><br><br><br><br><br><br><br>
<small>
-Sample Programs-<br><br>
■MINIGAME■<br>
<a href="../minigame/index.html" target="_parent">
<img src="../minigame/tennis.gif" border="0"></a><br>
<small>HPに貼り付けられるミニゲーム</small><br><br><br>
■MOUSEストーカー■<br>
<a href="../mouse/index.html" target="_parent">
<img src="../mouse/msoption.gif" border="0"></a><br>
<small>マウスを画像が追いかます</small><br><br><br>
■壁紙動画エンジン■<br>
<a href="../movie/index.html" target="_parent">
<img src="../movie/sakura.gif" border="1"></a><br>
<small>壁紙をJavaScriptで動かします</small><br><br><br>
■画像制御■<br>
<a href="../pic/index.html" target="_parent">
<img src="../pic/slide.gif" border="0"></a><br>
<small>JavaScriptで画像を制御します</small><br><br><br>
■ウインドウ制御■<br>
<a href="../win/index.html" target="_parent">
<img src="../win/pop.gif" border="1"></a><br>
<small>JavaScriptでウインドウ<br>を制御します</small><br><br><br>
■HPアクセサリー■<br>
<a href="../acc/index.html" target="_parent">
<img src="../acc/tokei.gif" border="1"></a><br>
<small>JavaScriptで時刻や<br>日付を表示します</small><br><br><br>
■クッキー■<br>
<a href="../cookie/index.html" target="_parent">
<img src="../cookie/ac.gif" border="0"></a><br>
<small>訪問回数等をキャッシュします</small><br><br><br>
■その他■<br><br>
<input type="button" value="お気に入り登録"
onclick="window.open('../other/index.html','_parent')"><br><br>
<small>お気に入り登録ボタン<br>等を作成します</small><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br>
</small>
</div>
</body>
</html>
サンプルはページ内に表示することを想定して作られています。

←ここからスクリプト






もっとスクロールを早くしたい場合は「wy+=2;」などに変更してください

割り込みの間隔でもスピードを変更できます

←スクリプトここまで



改行で最初に表示される部分を空白にしています



画像にリンクを貼っています。スクロール窓を表示しているページにリンク先を開くために「_parent」としていますが別のウインドウに開きたい場合は「_blank」にします

..


..


..