2017-03-15 53 views
0

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

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

<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; 
} 

希望有人会知道这个答案!我知道在这个网站上有这样的问题,但没有一个为我工作。

提前致谢!

回答

相关问题