チョットした小技

文字や画像をスクロールさせよう

<marquee>★</marquee>のみ
★=スクロールさせる文字や画像

スクロール方向の指定

<marquee direction="☆">★</marquee>
☆=left(左方向)right(右方向)up(下から上へ)down(上から下へ)
★=スクロールさせる文字や画像

スクロール方法の指定

<marquee behavior="☆">★</marquee>
★=スクロールさせる文字や画像
☆=scroll(一定方向のスクロールの繰り返し)
slide(指定した方向に一回だけのスクロール)
alternate(左右交互)
タグ使用例
<html>
<head>
<title>タグであそぼう!</title>
</head>
<body bgcolor="#008b8b">
<marquee behavior="alternate" bgcolor="yellow" height="25" width="350">
マーキースクロール
</marquee>

</body>
</html>
上のタグのだとこうなります
マーキースクロール
<marquee behavior="scroll" direction="down" bgcolor="#ffe6f0" height="25" width="350">
マーキースクロール
</marquee>

マーキースクロール

更新履歴やお知らせ等にも利用可能です
更新履歴
?月?日  ??のページ
?月?日  ??のページ
?月?日  ??のページ
?月?日  ??のページ

スクロールスピードの指定
<marquee bgcolor="#00FF99" scrollamount="★" width="350">
マーキースクロール
</marquee>
★=スクロール量(ピクセル値)
マーキースクロール
上下左右にスクロール
<marquee direction="up" behavior="alternate">
<marquee behavior="alternate">マーキースクロール</marquee></marquee>
★=スクロール量(ピクセル値)
マーキースクロール

文字を点滅させよう

<blink>★</blink>のみ
★=点滅させる文字

背景画像をスクロールさせず固定表示する

<body background="***.gif" bgproperties="fixed">のみ

ページを自動的に切り替える

<META HTTP-EQUIV="refresh" CONTENT="★;URL=☆">
★=ページを切り替えるまでの秒数
☆=ジャンプ先のURL
ホームページを引っ越した時など古いホームページに
このタグを使用すれば指定秒後に自動的にジャンプしてくれます
タグ使用例
<html>
<head>
<title>タグであそぼう!</title>
<META HTTP-EQUIV="refresh" CONTENT="5;URL=http://www4.osk.3web.ne.jp/~kitayan/">
</head>
<body bgcolor="#008b8b">
ホームページを引っ越しました5秒後に自動的にジャンプします
</body>
</html>

<body onLoad=setTimeout('location.href="ジャンプ先のURL",5000')>
とすればページが完全に読み込まれてからジャンプさせる事が出来ます
例では5000=5秒で読み込まれてから5秒後にジャンプします

立ち上げたメールソフトにタイトルをつける

<a href="mailto:★?Subject=HPからのメール">メールで送信!</a>
★=送信先メールアドレス
サンプルですクリックするとメーラーが立ち上がります

CC,BCCを指定する場合(,カンマで区切る事によりそれぞれ複数アドレスの指定が可能です)
<a href="mailto:★?Subject=HPからのメール&cc=???@???.com &bcc=???@???.com&quot;>メールで送信!</a>
サンプルですクリックするとメーラーが立ち上がります

立ち上げたメールソフトにタイトル、本文をつける

<a href="mailto:★?Subject=HPからのメール &body=ここに本文!!">メールで送信!</a>
★=送信先メールアドレス
サンプルですクリックするとメーラーが立ち上がります

本文を改行する
<a href="mailto:★?Subject=HPからのメール &body=ここに本文!!%0D%0Aここで改行%0D%0Aここで改行">メールで送信!</a>
サンプルですクリックするとメーラーが立ち上がります

ページ移動時トランジション効果をつける

<meta http-equiv="Page-Enter" content="revealTrans(Duration=★,Transition=☆)">
<meta http-equiv="Page-Exit" content="revealTrans(Duration=★,Transition=☆)">

★=切り替え時間(秒)を指定する ☆=トランジション効果の指定(番号で指定)
このタグを使えばページ切り替え時、色々なワイプ効果で切り替わります
指定できるトランジション効果は以下の通りで、番号で指定
0Box In1Box Out2Circle In3Circle Out
4Wipe Up5Wipe Down6Wipe Right7Wipe Left
8Vertical Blinds9Horizotal Blinds10Checkerboard Across11Checkerboard Down
12Random Dissolve13Split Vertical In14Split Vertical Out15Split Horizotal In
16Split Horizotal Out17Strips Left Down18Strips Left Up19Strips Right Down
20Strips Right Up21Random Bars Horizotal22Random Bars Vertical23Random
  

ページ切り替え時にアラートウインドウを出す

<body onUnload="alert('★')">
★=表示させる文字
JavaScriptのonUnloadメソッド(命令)を使ってページ切り替え時に
アラートメッセージを出します
<body onload="alert('★')">でページ読み込み時に
メッセージを出す事も出来ます
タグ使用例
<html>
<head>
<title>タグであそぼう!</title>
</head>
<body bgcolor="#008b8b" onUnload="alert('さようなら、また来てね')">

</body>
</html>

リンク先を小ウィンドで表示

<input type="button" value="CLICKして" onClick=window.open("★","☆","toolbar=no,location=no,directories=no,status=yes,
menubar=yes,scrollbars=yes,resizable=yes,width=500,height=350");>

タグを貼り付ける場合、改行せずに一行で記述して下さい
★=リンク先URL
☆=ウィンド名
toolbar ツールバーの表示、非表示
location ロケーションバーの表示、非表示
directories ディレクトリィバーの表示、非表示
status ステータスバーの表示、非表示
menubar メニューバーの表示、非表示
scrollbars スクロールバーの表示、非表示
resizable ウィンドウサイズの変更、変更不可
width,height 表示されるウィンドウの高さ、幅
サンプル


右クリックを禁止する

<body onContextmenu="return false">5.0以降だけの機能です


画像の右クリックを禁止するタグはこちら
画像を保存させにくくする小技はこちら

印刷ボタン

<input type="button" value="プリントアウトする!" onclick="window.print()">

テーブルを横に並べて表示する

テーブルタグ内に新たにテーブルタグを記述すれば
横並びのテーブルが作成できます

横に並べるには最初のテーブルタグ内の>td<〜>/td<に新しくテーブルタグを入れます
タグ例
T1、セル1T1、セル2
T1、セル3T1、セル4
T2、セル1T2、セル2
T2、セル3T2、セル4
T3、セル1T3、セル2
T3、セル3T3、セル4
ソース