2011-03-18 84 views
1

我一直在嘗試創建一個簡單的翻轉圖像,並且我已經使用CSS和JavaScript方法完成了此操作。但是,我無法獲取此圖像鏈接。鏈接一個JS翻轉圖像

在CSS版本中(如下所示),我使用的是背景圖片,並且鏈接在「空白」HTML塊中無法識別。

在JS版本中,正在從圖像文件夾中調用圖像。像CSS一樣,鏈接在「空白」HTML塊中不被識別。當我在HTML塊中放置圖像時,我的翻轉停止工作。

我目前在我的HTML代碼中有以下內容。翻車的工作,但鏈接不會:

<div class="quick-map"><a href="Services/FloorPlan.aspx" onclick="window.open(this.href);return false;">&nbsp;</a></div> 

在這個例子中,該鏈接的作品,但翻車別:

<div class="quick-map"><a href="Services/FloorPlan.aspx" onmouseover="document.MyImage.src='images/quick-map.png';" onmouseout="document.MyImage.src='images/quick-map-over.png';"><img alt="" src="images/quick-map.png" /></a></div> 

任何建議,將不勝感激。這一定是如此簡單,我只是不明白爲什麼它不起作用。我可以發誓我是正確的做這個...

回答

0

嘗試使用此:

<div class="quick-map"> 
<a href="Services/FloorPlan.aspx" onmouseover="document.getElementById('MyImage').src='images/quick-map.png';" onmouseout="document.getElementById('MyImage').src='images/quick-map-over.png';"> 
    <img alt="" src="images/quick-map.png" id="MyImage" /> 
</a> 
</div> 

記住id需要在每個網頁上獨一無二的,所以如果你有多個圖像,他們需要不同的ID

+0

不同的ID或相同的類:) – Kyle 2011-03-18 13:49:20

+0

@Kyle:如果圖像都是相同的,那麼是相同的類,如果它們是唯一的,那麼使用一個類將需要一個抽象級別,我認爲這是一個超出範圍考慮到來自OP – 2011-03-18 13:59:02

+0

的初始代碼,我將研究這個問題,謝謝。 – creativeedg10 2011-03-18 13:59:03

0

我只是想通了。原來,我還必須給顯示器:塊與寬度和高度的<span>標記除了我在CSS中引用的圖像。我知道這很簡單...謝謝大家的幫助。

+0

如果它是最好的,可以接受你自己的答案。如果其他答案是有幫助的,你可以對他們加註。 – KatieK 2011-03-18 17:06:41