鼠标放在图片上面 出现下拉列表

<div id="nav" οnmοuseοver="block()" οnmοuseοut="cancel()">
                                <img id="img" src="assets/images/touxiang.jpg" class="touxiang" width="50px" alt="">
                                <div id="menu" class="kuai">
                                            <ul>
                                                <li></li>
                                                <li>设置</li>
                                                <li>个人中心</li>
                                                <li>内容管理</li>
                                                <li>退出登录</li>
                                            </ul>
                                        </div>
                            </div>

<script>
        cancel()
            function block(){
                document.getElementById("menu").style="display:block";
            }
         
            function cancel(){
                document.getElementById("menu").style="display:none";
            }
        </script>

动图不动了，就是鼠标放头像上显示下来列表