ちょっと便利なテクニック集

知ってればちょっと役立つかもしれないような
テクニックをいくつか挙げてみました。
ここではHTMLの基礎的な知識がある
ということを前提に紹介しています。
(ソースはコピー&ペーストで使えます)
ここにあったいくつかのJavaScriptは専用ページへ移動しました
* JavaScriptサンプル集 *





*--*--* お気に入り関連 *--*--*



◆お気に入りに追加ボタン◆
HPへ来てくれた人が「お気に入り(ブックマーク)」へ
追加してくれやすくするボタンです。

http:で始まるURLの部分にあなたのページのURLを記述してください。
ページタイトルの部分にそのページのタイトルを書きます。
普通のリンクのようにリンクポイントの部分を画像に置き換えることもできます。

ソース記述例 表示例
<A HREF="javascript:window.external.addFavorite('http:で始まるURL','ページタイトル')"> お気に入りに追加☆ </A> お気に入りに追加☆





◆お気に入りにオリジナルアイコン(Favicon/ファビコン)を表示◆
こんな感じになります↓(赤丸のとこ)

このやり方は下記のサイト様で詳しく解説してくれています。
いろいろなファビコン素材も配布しています!
他にも「 ファビコン 素材 」などのキーワードで検索すればイロイロでてきます。





*--*--* 文字関連 *--*--*



◆IEでも点滅文字◆
文字を点滅させる<BLINK>タグはネットスケープだけでしか効果がありません。
でもIEだって文字を点滅させることは可能です。


SCROLLDELAY=は点滅の速さです。
SCROLLAMOUNT=WIDTH=の数値は同じにして点滅させたい文字列の
長さに合わせて調整しますが、ちゃんと調整しても多少ズレるので
点滅させる文字の最初に全角スペースを入れておくといい感じです。
ネットスケープで見た場合、今度は<MARQUEE>タグが無効になるので
ソースの前後をちゃんと<BLINK>タグで挟んでおきましょ。

ソース記述例 表示例
<BLINK>
<MARQUEE SCROLLDELAY="300" WIDTH="100" SCROLLAMOUNT="100"> IEでも点滅!</MARQUEE>
</BLINK>
 IEでも点滅!








*--*--* リンク関連 *--*--*



◆一定時間後にジャンプ◆
HPを引越した場合によく使います。
(注)このタグはヘッダ部内に記述してください
秒数 のところに半角数字で何秒後にジャンプするか指定します。
ジャンプ先のURL のところにジャンプ先のファイル名かURLを書きます。
秒数 URL= の間の ; 「セミコロン」は忘れずに。
ソース記述例 表示例
<META HTTP-EQUIV="refresh"CONTENT="秒数;URL=ジャンプ先のURL">  ここをクリック

(注)↑何故か時々ジャンプしない場合もあるので、
必ず普通のリンクも用意しておきましょ。








*--*--* Mail関連 *--*--*



◆E-Mailへのリンク◆
メール送信リンクです。
mailto:の後にメールアドレスを記述することで、
リンクポイントをクリックするとメーラーが起動するようになります。
通称「めりんく」

ソース記述例 表示例
<A HREF="mailto:メールアドレス">めーる </A> めーる  





◆E-Mail自動件名入力◆
上のメール送信リンクで、メアドだけでなく
SUBJECT(件名)も自動で入力します。  

自分のメアドの後に ?subject=と続けてメールに挿入する件名を記述します。
OutlookExpressNetscapeMessenger以外のメーラーでは
自動で件名が挿入されない事もあります。

ソース記述例 表示例
<A HREF="mailto:メールアドレス?subject=やっほー">めーる 2</A> めーる2  





◆E-Mail自動本文入力◆
今度は本文を自動で入力します。  
自分のメアドの後に ?body=と続けてメールに挿入する本文を記述します。
これもOutlookExpressNetscapeMessenger以外の
メーラーでは自動で本文が挿入されない事があります。

ソース記述例 表示例
<A HREF="mailto:メールアドレス?body=こんにちは">めーる3</A> めーる3





◆E-Mail自動件名&本文入力◆
今度は件名と本文を同時に入力します。  
自分のメアドの後に ?subject=件名&body=本文と続けると
件名と本文を一緒に挿入します。注意点としては「?」は一回だけです。
OutlookExpressNetscapeMessenger以外の
メーラーでは自動で件名と本文が挿入されない事があります。

ソース記述例 表示例
<A HREF="mailto:メールアドレス?subject=やっほー&body=こんにちは">めーる4</A> めーる4






*--*--* ページスクロール関連 *--*--*



◆スクロールバーの色変更◆
縦長や横長のページを表示する時の「スクロールバー」の色を変更します。
ページソースの<BODY>タグ内
STYLE="SCROLLBAR-BASE-COLOR:色指定" を記述して
スクロールバーの色を指定します。色はRGB形式でも色名でも指定可。

ソース記述例 表示例
<BODY STYLE="SCROLLBAR-BASE-COLOR:#FFC9B0"> これは表示例なしです。
みなさんでやってみてくださいね。
 





◆詳細なスクロールバーの色変更◆
スクロールバーの細かい部分の色も指定出来ます。
これもInternetExplorer5.5以上の機能です。

細かい部分にまで色を指定するとソースが長くなってしまうので、
ヘッダ部の <style type="text/css"><!-- から--></style>の間に
スタイル指定を記述すると良いでしょう。

3dlight-color: でスクロールバーのボタンの立体部分の色指定。
shadow-color: でスクロールバーの枠の影の色指定。
face-color: でスライドさせる部分の色指定。
highlight-color: でスクロールバーの明るい部分の色指定。
darkshadow-color: でボタンの暗い影部分の色指定。
arrow-color: で矢印の部分の色指定。
track-color: でスライド部分の下地色指定。
ソース記述例 表示例
<HTML>
<HEAD>
<TITLE></TITLE>

<style type="text/css"><!--
BODY{
scrollbar-3dlight-color:red;
scrollbar-shadow-color:white;
scrollbar-face-color:blue;
scrollbar-highlight-color:cyan;
scrollbar-darkshadow-color:black;
scrollbar-arrow-color:white;
scrollbar-track-color:lightcyan;
}
--></style>

</HEAD>
<BODY>
ページの本文
</BODY>
</HTML>
これも表示例なしです。
みなさんでやってみてくださいね。


* - * Top Page * - *

*iphone アプリ 開発
*太陽光発電