分かりにくいかも知れませんが、以下のソースを用いてJavaScriptの部分でボタンの並び替え、
マウスイベントを実行したいんですが、うまく実行できないので教えてください。
<html><head><title>a</title>
<input type='button' value='34' style='background-color:#f60;left:137px;position:absolute;top:100px;width:100' onMouseOver='b()'>
<input type='button' value='58' style='background-color:#f60;left:163px;position:absolute;top:100px;width:100' onMouseOver='b()'>
<input type='button' value='100' style='background-color:#f60;left:250px;position:absolute;top:100px;width:100' onMouseOver='b()'>
<SCRIPT LANGUAGE="JavaScript">
function a(){
ここでボタンをvalue='数値'の小さい物が最前に来るよう並び替え
(value = 100,58,34の順でhtmlで書くのではなく、ここで並び替えをしたい)
}
function b() {
ここでマウスがボタンに乗ったらそのボタンを最前に表示したい
}
</SCRIPT></body></html>
function a,bの部分を教えてもらえると幸いです。
以上、質問が下手で分かりづらいですが、よろしくお願いします。
A 回答 (1件)
- 最新から表示
- 回答順に表示
No.1
- 回答日時:
こんなんでどうですか。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" id="html">
<head>
<title>sample</title>
<!-- メタタグ省略 -->
<style><!--
input#btnA, input#btnB, input#btnC {
position: absolute;
top: 100px;
width: 100px;
}
input#btnA { left: 137px; }
input#btnB { left: 163px; }
input#btnC { left: 250px; }
--></style>
</head>
<body onload="a()">
<form>
<input type="button" id="btnA" value="34" onmouseover="b(this)" />
<input type="button" id="btnB" value="58" onmouseover="b(this)" />
<input type="button" id="btnC" value="100" onmouseover="b(this)" />
</form>
<script type="text/javascript"><!--
var idList = ['btnA', 'btnB', 'btnC'];
function a()
{
var key, obj;
for (key in idList) {
obj = document.getElementById(idList[key]);
obj.style.zIndex = 1000 - obj.value;
}
}
function b(obj) { a(); obj.style.zIndex = 1000; }
//--></script>
</body>
</html>
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・人生のプチ美学を教えてください!!
- ・10秒目をつむったら…
- ・あなたの習慣について教えてください!!
- ・牛、豚、鶏、どれか一つ食べられなくなるとしたら?
- ・【大喜利】【投稿~9/18】 おとぎ話『桃太郎』の知られざるエピソード
- ・街中で見かけて「グッときた人」の思い出
- ・「一気に最後まで読んだ」本、教えて下さい!
- ・幼稚園時代「何組」でしたか?
- ・激凹みから立ち直る方法
- ・1つだけ過去を変えられるとしたら?
- ・【あるあるbot連動企画】あるあるbotに投稿したけど採用されなかったあるある募集
- ・【あるあるbot連動企画】フォロワー20万人のアカウントであなたのあるあるを披露してみませんか?
- ・映画のエンドロール観る派?観ない派?
- ・海外旅行から帰ってきたら、まず何を食べる?
- ・誕生日にもらった意外なもの
- ・天使と悪魔選手権
- ・ちょっと先の未来クイズ第2問
- ・【大喜利】【投稿~9/7】 ロボットの住む世界で流行ってる罰ゲームとは?
- ・推しミネラルウォーターはありますか?
- ・都道府県穴埋めゲーム
- ・この人頭いいなと思ったエピソード
- ・準・究極の選択
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
追加ボタンを押した際に ok ボ...
-
GASでチェックボックスを一括of...
-
特定の文字列を複数抜き出した...
-
jsonテキストデータの並び替え...
-
jQueryで同じクラス名のものを...
-
鍵盤アプリで、スマホの画面に...
-
jQueryでシンセサイザーを作っ...
-
HTMLでサブフレームから親のス...
-
ボタンを押したあとに画像を表...
-
disabled プロパティが表示され...
-
初心者です。gulpでコンパイル...
-
食材の期限を管理するためにGAS...
-
ビデオのJSについて
-
プログラミング 学習
-
ジャバスクリプトについて。
-
Colorboxがうまく設置できません
-
jsで質問です。 ボタンが二つ存...
-
前回の質問の続き function mov...
-
このプログラムに、王手をかけ...
-
前回の質問の続き function mou...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
食材の期限を管理するためにGAS...
-
ビデオのJSについて
-
前回の質問の続き function mov...
-
このプログラムに、王手をかけ...
-
このプログラムに王様の逃げ道...
-
初心者です。gulpでコンパイル...
-
前回の質問の続き function mou...
-
鍵盤アプリで、スマホの画面に...
-
スマホ上で、左右スワイプで次...
-
jQueryで同じクラス名のものを...
-
読み込んだQRコードをフォーム...
-
追加ボタンを押した際に ok ボ...
-
Colorboxがうまく設置できません
-
階層別の組織図の自動作成について
-
二次元配列を使って順位をだす...
-
【GAS】WEBアプリでハイパーリ...
-
HTMLで作った時報アプリが動き...
-
セレクトを全て選択されていな...
-
画面遷移を行わずに同一ページ...
-
jsで質問です。 ボタンが二つ存...
おすすめ情報