過去ログ NO.1097488324
□ 英昭 [2004年10月07日01時52分]INPUT TYPE='button' VALUE='閉じる'のようなボタンではなく、自分で作った画像を、ボタンにしたいのですがどうすればよいのですか？
□ NXer [2004年10月07日20時22分]はじめまして。NXerです。
英昭さんのウェブページ全体が当方には不明です。そこで次のような
ページを作成してみました。これは過去ログで、やす。さんからご提案が
あったものです。電光！というcgi用の窓を開閉する2ヶのボタンを貼り付
けたページです。何か参考になるところがあれば、幸いです。
>INPUT TYPE='button' VALUE='閉じる'のようなボタンではなく、自分で作った画像を、ボタン
ということから、
btn300open.gif
btn300close.gif
を用意してみました。
javascriptの関数を使い、buttonタグで開閉をするというものです。
.gif画像に「開」「閉」の文字を入れておくことも一案ですが、
例のようにボタン上に文字を表示できました。フォントサイズが
指定できるかは確認してありません。たぶんできます。
------------------------------------------------
<TITLE>denkoh with open/close buttons </TITLE>
<SCRIPT>
<!--
var Den;
function OpenDen(){
Den=window.open('http://127.0.0.1/~user/denkoh/denkoh.cgi?html','Den','width=480, height=50');
}
function CloseDen(){
if (Den.closed == true){
OpenDen();
}
else {
window.Den.close();
}
}
//--!>
</script>
</HEAD>
<BODY>
<BUTTON onclick="OpenDen();" height="20" width="100">
<IMG src="btn300open.gif" width="64" height="57" border="0">開
</BUTTON>
<BUTTON onclick="CloseDen();" height="20" width="100">
<IMG src="btn300close.gif" width="64" height="57" border="0">閉
</BUTTON>
</BODY>
</HTML>
----------------------------------------------------
なお文献2）にはボタン一つで開閉が可能なスクリプトが
掲載されています。
参考文献
1）インターネットマガジン編集部編：『ホームページ
裏技大全』インプレス p.38 1999
2) http://lounge.suepon.com/data/1096732100.html
謝辞
この回答は、やす。さんの投稿にヒントを得たものです。
ありがとうございました。
□ やす。 [2004年10月10日23時36分]こんばんは。 やす。 デス。
わ！ これ、
> <BUTTON onclick="OpenDen();" height="20" width="100">
> <IMG src="btn300open.gif" width="64" height="57" border="0">開
> </BUTTON>
すごいですね！！
何年かｗｅｂやってて、ぜんぜん気がつきませんでした。
普通（？）、ボタンというと、
<input type="button"> で記述して、<button>〜</button> というタグがあることは知っていましたが、この違いがわからなかったのです。
自分でやってみて、嬉しびっくりでした(^^;。
□ NXer [2004年10月11日18時52分]>ボタン
英昭さん、ご質問の関連にてやす。さんのレスを続けさせてい
ただきますのでよろしく。NXerです。
>びっくりでした(^^;。
現在ホームページのアクセス度数はおそらく天文学的な数字と
思います。アクセスするページの中で
1）視覚的情報に依存するサイトが、ほぼ100％ではないでしょうか。
人口構成の変化に伴い、より大きなサイズの画像や文字フォント、
より見やすい、扱いやすいページ作りは、必要条件になると思い
ます。とりわけ、視覚器官の老化、損傷は避けがたく、それに比
例してこのような対応がますます必要となることは当然です。
さらに、人口が減少している幼児、児童、中高生（ほぼ100%の就
学率）という成長過程の「こども」がコンピュータに接する（ほ
ぼ義務的）ことから、操作の指示ボタンについてもサイト作成者
に、同様の対応が求められているように考えます。
2）そこで上述のボタンタグにアニメを加えてみました。
HP作成ソフト登載のアニメボタン01.gifです。お試しください。
回転する地球アニメの例ですが、ボタン上でみると、静止した
画像や文字よりもはるかに視覚に訴える力があります。マウス
のカーソルを自然にボタンの方向に移動させてしまいました。
テストしていませんが、文字の点滅でもその効果は十分あるよ
うに思います。
3）htmlタグが、ボタン・タグ内で使用可能ということから、ボタンの
範囲全体が、いわば、小ウィンドウを形成するようです。
そこで文字の属性であるフォントサイズ、色もためしてみました。
buttonstyleはよく分りませんが、背景色や画像を指定できます
のでこの点は例をご教示ください。画像を2つ乗せることもでき
ました。
------------------------------------------------------
<BUTTON onclick="OpenDen();" height="20" width="100">
..<IMG src="01.gif" width="53" height="53" border="0">・・アニメgif
..<IMG src="btn300d.gif" width="64" height="57" border="0">・通常gif
...... <FONT size="3" color="yellow">
............ 開
...... </FONT>
</BUTTON>
----------------------------------------/....はインデント用/
>すご、、、、！！
キーボードに依存しない入力に、マウスとタッチパッドがあります。
ボタンの使い様によっては、「キーボードよ、さようなら」、という
ウェブサイトを構築することも夢ではないかもしれません。
としたら、すごいですね。
一定時間書込が無かったので過去ログに移りました
|
|
