更改onclick =“showMore（）”onm​​ouseover（悬停）

Question

<input id="button" type="button" value="Expand" onclick="showMore()">

<div id="d3">
<div class="button12" onclick="document.location='#'">Home</div>
<div class="button12" onclick="document.location='#'">About</div>
<div id="d1">
    <input type="button" value="Shrink" onclick="showLess()">
</div>

<script type="text/javascript">//<![CDATA[ 

var button = document.getElementById("button");
var d3 = document.getElementById("d3");
function showMore() {
    button.style.display="none";
    d3.style.display="block";
}

function showLess() {
    button.style.display="inline-block";
    d3.style.display="none";
}
//]]>  

</script>

如何将onclick="showMore()"更改为hover..

我需要它显示而不点击它。

请尽快帮助我..

Answer 1

您可以使用onmouseover代替onclick

像这样

<input id="button" type="button" value="Expand" onmouseover="showMore()">

<div id="d3">
<div class="button12" onclick="document.location='#'">Home</div>
<div class="button12" onclick="document.location='#'">About</div>
<div id="d1">
    <input type="button" value="Shrink" onclick="showLess()">
</div>

Answer 2

使用像这样的CSS样式

#btn2:hover
{
//your design here
}

或像这样使用onmouseover

<input id="button" type="button" id="btn2" value="Expand" onmouseover="showMore()">

Answer 3

您可以更改为onmouseover="showMore()"

如果您无法编辑（无法访问）代码，您可以在页面加载或任何相关事件上尝试类似的操作。

$('#yourID').attr ('onClick', "onmousover");

Answer 4

$("#button").mouseover(function(){
    $("#button").hide();
});