Question

我正在尝试制作一个菜单，其中有一个箭头指向下滑动菜单。我想要做的是将图像更改为单击时指向上方的箭头。我完成了使用onclick。但是，我想将图像更改回指向再次单击的箭头。我用jQuery，css和html尝试了大量不同的代码，到目前为止还没有任何工作。

这是我到目前为止的代码：

<script> 
$(document).ready(function(){
$("#flip").click(function(){
    $("#panel").slideToggle("slow");
   });
});
   </script>

这是jQuery，在w3schools上发现了这个。这是为了切换菜单。

 <div id="menu" class="m1">

<div id="flip" >

<img src="pic/aroowdown.png" width="32" height="32" onclick="this.src='pic/aroowup.png'" />


</div>
<div id="panel">

<ul>
    <li><a href="epi.hmtl"> EPISODER </a></li>
    <li><a href="kar.html"> KARAKTERER </a></li>
    <li><a href="about.html"> OM OSS </a></li>
    <li><a href="prod"> PRODUKSJON <a></li>
</ul>

</div>


</div>

这是“翻转”和“面板”，你可以看到我使用“onClick”。

我还要为翻盖和面板添加CSS，以防万一。我不认为这与我的问题有很大关系。

#panel, #flip {

    text-align: center;
    background-color: #000;
    height: 30px;
    opacity: 0.9;
    cursor: pointer;

}

#panel {
    padding: 80px;
    display: none;
    background-color: #A9A9A9;
    opacity: 0.9;


}

ul {
    list-style-type: none;
}

li {
    display: inline;
    padding: 0px 30px;
}

希望有人知道答案！我知道在这个网站上有这样的问题，但没有一个对我有用。

提前致谢！

Answer 1

您的箭头只是图片，因此您应该可以使用Javascript: Changing an image on click and then back to original when clicked again

的答案

第二次单击时，更改onclick返回原始图像

1 个答案: