画像ダウンロードボタン

スクリプトの概要

画像のダウンロード用ボタンを自動作成する。

普通は右クリックメニュー等を使ってダウンロードしてもらう画像をボタンをクリックする事でダウンロード可能とする。

最新のWindows版IEでしか動作しません。他のブラウザの人には従来どおりの方法でダウンロードしてもらいます。

動作サンプル

DOWNLOADボタンをクリックすると保存のダイアログが表示されます。(動作対象のブラウザでなければボタンは表示されていません。)

壁紙サンプル1

壁紙サンプル2

HTML&SCRIPT

専用外部Javascriptの呼び出し

<head>〜</head>の間に記述します。
<script type="text/Javascript" src="img_download.js"></script>

外部javascriptファイルは img_download.js です。右クリックメニューの「対象をファイルに保存」でお持ち帰りください。

BODYタグの変更

BODYタグに初期化関数を指定します。
<body onload="InitDL();">

IMGタグの変更

ダウンロードボタンを付けたい画像にはidを付けておきます。
<img src="〜" id="ID">

カスタマイズ

自動挿入するボタンの直前で改行(<br>を挿入)する事もできます。外部javascriptファイル内のコメントを参照してください。

ボタンにスタイルシートを指定したい場合も外部javascriptファイルを書き換えます。ファイル内のコメントを参照してください。

注意・制約事項

ダウンロードボタンを付ける画像は何かのタグの配下に単独で収まっている必要があります。

OK → <td><img 〜></td> <p><img 〜></p>

NG → <td><img 〜><img 〜></td> imgが複数あるのでNG

?? → <p><img 〜>画像の説明テキスト</p> img以外の説明文などがある場合、ボタンはその後ろに生成されます。