Javascript mouseover，在圖像中添加邊框

我在我的網站上有一些圓形按鈕，當鼠標懸停時，我想獲得藍色輪廓。我該怎麼做？我試圖做的這個網站是http://www.inglesfield.com/。我已經有了一個mousedown事件來防止圖像拖動，是否可以獨立地同時發生兩個事件（mousedown和mouseover）？謝謝！：dJavascript mouseover，在圖像中添加邊框

來源

2013-03-04 william44isme

不要使用表格進行造型，不要使用內聯樣式，不要使用內聯腳本，縮進腳本，不要使用中心標籤，不要複製ID。請閱讀：https://developer.mozilla.org/en-US/docs/HTML/Introduction – howderek 2013-03-04 17:49:07

我知道這一點，但中心標記是必要的。我嘗試了許多其他CSS技術，但最簡單和最有效的方法是

。即使谷歌使用它（謹慎），檢查他們的代碼:) – william44isme 2013-03-04 17:55:58

區別在於谷歌需要節省帶寬，因爲每一個字節都爲他們計數，你的網站可能沒有足夠的訪問者來證明使用已棄用的標籤。學會在早期以正確的方式做事情，然後在未來改變自己的方式會更好。 http://stackoverflow.com/questions/1967191/why-would-google-use-a-font-tag – howderek 2013-03-04 19:25:28

你可以在圖像上的方式添加CSS hover樣式

#content:hover { border: 2px solid blue; border-radius: 100px; }

：而不是使用IDS的圖像，使用類=「內容」，因爲IDS應該是一個HTML獨特

頁

來源

2013-03-04 17:33:31 mansur

謝謝！完美的解決方案：D – william44isme 2013-03-04 17:56:23

順便說一下，現在檢查網站。雖然它確實添加了邊框，但它似乎會使圖像稍微小一些，影響排中的其他圖像......這是正常的嗎？我在Chrome和Safari中嘗試過，它的行爲相同。 – william44isme 2013-03-04 18:04:15

是的，因爲邊界需要空間。例如，您可以在#content {border：2px solid transparent; }其中保留的空間 – mansur 2013-03-04 18:20:56

只需使用CSS：hover僞類..你不需要的JavaScript此

<img class="hover" src="http://www.hollywoodreporter.com/sites/default/files/2012/12/img_logo_blue.jpg"/> 
<style> img.hover:hover {border:5px solid #555;} </style>

例如：http://jsfiddle.net/orlando/Y3Ux6/

來源

2013-03-04 17:35:16 Orlando

Javascript mouseover，在圖像中添加邊框

回答

相關問題