1

我正在尝试创建一个图像输入，当鼠标按下时将图像从gatherHerb.jpg（默认）更改为gatherHerb2.jpg。该代码实际上可以很好地完成预期的工作，但现在默认的 sarif“提交”显示在图像上。

我也尝试设置 value="" 无济于事。有什么帮助吗？

首先是 CSS，然后是 HTML。即使在堆栈上，格式化对我来说显然也是一个问题:(

#herbButton {
   border-radius: 5px;
   width: 100px;
   height:30px;
   background-image: url(buttons/gatherHerb.jpg)} 


<input type="image" id="herbButton" onClick="herbClick();"
    onMouseDown="document.getElementById('herbButton').style.backgroundImage='url(buttons/gatherHerb2.jpg)'"<br>
    onMouseUp="document.getElementById('herbButton').style.backgroundImage='url(buttons/gatherHerb.jpg)'"<br>
/>
4

2 回答 2

2

不要使用图像作为输入类型的图像背景

像这样在代码中使用输入类型图像的src属性

#herbButton {
   border-radius: 5px;
   width: 100px;
   height:30px;} 


<input type="image" src="buttons/gatherHerb.jpg" id="herbButton" onClick="herbClick();" onMouseDown="document.getElementById('herbButton').style.backgroundImage='url(buttons/gatherHerb2.jpg)'" onMouseUp="document.getElementById('herbButton').style.backgroundImage='url(buttons/gatherHerb.jpg)'" />

将 src url 更改为您的完整 url。

你会在这里找到更多

于 2013-11-11T06:22:00.593 回答
0

我想这会对你有所帮助

<input value=" " type="image" id="herbButton" onClick="herbClick();" onMouseDown="document.getElementById('herbButton').style.backgroundImage='url(buttons/gatherHerb2.jpg)'" onMouseUp="document.getElementById('herbButton').style.backgroundImage='url(buttons/gatherHerb.jpg)'" />

查看更新：您之间应该有一个空格value=" "，

所以使用value=" "而不是value=""

于 2013-11-11T06:17:48.983 回答