Question

当鼠标悬停在span id ='requestSent'时，我希望显示div id ='cancelReq'

我已经尝试过这段代码了，但它没有用。

<style> 
    #cancelReq {
         display: none;
    }

    #requestSent:hover + #cancelReq { 
         display: block;
    }   
</style>

<div id='addUser'>
     <span id='requestSent'>Add Friend</span>
</div>
<div id='cancelReq' >hello there</div>

Answer 1

您可以使用javascript。以下是您的问题的代码：

<script type="text/javascript">
     function fun(){
         document.getElementById("cancelReq").style.display = "block";
     }

     function fun1(){
         document.getElementById("cancelReq").style.display = "none";
     }
</script>

并制作以下HTML代码：

<div id='addUser'><span id='requestSent' onmouseover="fun();" onmouseout="fun1();" >Add Friend</span></div>
<div id='cancelReq' >hello there</div>

将鼠标悬停在div内的span上，显示其他元素

1 个答案: