落ち込みボタンコードが機能しない

私は仕事をしなければならないウェブ上にいくつかのコードを見つけました... 3つのボタンに展開しようとしたときに問題が発生しました。下の太字の元のコード...私は遠くからだ2つの以上のボタンを追加するためのコードを、次のボタンが表示されますが、私は、ボタン2と3をクリックすると、彼らは唯一のボタン1をもたらす...]ボタン完全落ち込みボタンコードが機能しない

<script type="text/javascript"> 
//preload images first 
**img1=new Image() 
img1.src="CommonFiles/ArrowBackShadow.png" 
img2=new Image() 
img2.src="CommonFiles/ArrowBackPress.png"** 
img3=new Image() 
img3.src="CommonFiles/ArrowUpShadow.png" 
img4=new Image() 
img4.src="CommonFiles/ArrowUpPress.png" 
img5=new Image() 
img5.src="CommonFiles/ArrowForwardShadow.png" 
img6=new Image() 
img6.src="CommonFiles/ArrowForwardPress.png" 
</script> 


Body.... 
<body> 
<a href="whatever.htm" 
    onMousedown="document.images['example'].src=img2.src" 
    onMouseup="document.images['example'].src=img1.src"> 

<img src="CommonFiles/ArrowBackShadow.png" name="example" border=0></a> 

<a href="whatever.htm" 
    onMousedown="document.images['example'].src=img4.src" 
    onMouseup="document.images['example'].src=img3.src"> 

<img src="CommonFiles/ArrowUpShadow.png" name="example" border=0></a> 

<a href="whatever.htm" 
    onMousedown="document.images['example'].src=img6.src" 
    onMouseup="document.images['example'].src=img5.src"> 

<img src="CommonFiles/ArrowForwardShadow.png" name="example" border=0></a> 
</body>

次のコードで1つの作品ウェブマスター...ありがとうございます... Randall

出典

2012-01-01 Randall

これは、動作する回答を受け入れるうえで素晴らしいことです。応答の – SamStar

<a href="whatever.htm" 
    onMousedown="document.images['thishouldmatch1'].src=img4.src" 
    onMouseup="document.images['thishouldmatch1'].src=img3.src"> 

<img src="CommonFiles/ArrowUpShadow.png" name="thishouldmatch1" border=0></a>

出典

2012-01-01 17:14:06 rene

CSSで行います。

.button { 
    display: block; 
    /* hide text: */ 
    font-size: 0; 
    color: transparent; 
} 

#up { 
    width: 100px; /* replace with the width/height of your image */ 
    height: 30px; 
    background-image: CommonFiles/ArrowForwardUp.png; 
} 

#up:active:hover { 
    background-image: CommonFiles/ArrowForwardUp.png; 
} 

/* Same for forward */

し、HTML：

<a href="whatever.htm" class="button" id="up">Up</a> 
<a href="whatever.htm" class="button" id="Forward">Forward</a>

すべてのボタンが同じ幅と高さであるならば、あなたも.buttonセクションにwidthとheightを移動することができます。

長所：

HTMLコードは、それが維持するのは簡単です
これまで明確で見えます。
後で、HTMLに触れることなく、CSSスタイルコードを変更するだけで、ボタンのスタイルを完全に違うものにすることができます。
画像が無効になっているブラウザ、視覚障害者などに画像の代わりにテキストがあります
Javaスクリプトは不要です（一部のユーザーが無効にしているユーザーもいます）。

出典

2012-01-01 17:18:26 Yogu

おかげで...私はうまく機能し、このコードを使用して終了... – Randall

CSS #back { 高さ：は50px; 幅：50px; オーバーフロー：非表示。背景：url（BackNav.png）左上には繰り返しはありません。 display：ブロック; float：left; } #back：ホバー{ 背景位置：左下; } #up { 高さ：50px; 幅：50px; オーバーフロー：非表示。背景：url（UpNav.png）左上の繰り返しなし。 display：ブロック; float：left; } ＃up：ホバー{ 背景位置：左下; } #forward { 高さ：50px; .......上記のように続行... – Randall

落ち込みボタンコードが機能しない

答えて

関連する問題