2017/9/1前端小白的总结:关于hover的一个故事
来源:互联网 发布:打鱼机程序数据原理 编辑:程序博客网 时间:2024/05/30 23:17
闲来无聊,突发奇想,故来玩玩博客,也没什么好写的,就写一个long long ago自学前端时候遇到的一个小问题吧。
用jquery实现:当鼠标移入一个元素,显示一个框(可以是下拉框什么的), 可以对该元素和框的父元素上绑定事件。比如说:
html代码如下:
<li class="dropdown" id="personalLi"> <div class="personal">点我下拉</div> <ul class="personMenu" style="display: none;"> <li id="personalInfo"><a>信息维护</a></li> <li id="personalPwd"><a>密码修改</a></li> <li id=""><a>系统注销</a></li> </ul></li>
js代码如下:
$('#personalLi').hover(function () { var $ul=$(this).children().eq(1); if($ul.is(':hidden')){ $ul.show(); }else{ $ul.hide(); }});
想想自己刚开始的思路真是醉不行。对class为personal的div绑定hover事件,当鼠标移入div时,ul出现了。
但是你想对ul里的li做什么事情的时候,就不行了,一离开div,ul就会消失的呀!
然后我就在那里想对div和ul两个元素上都绑定hover事件,这样总可以了吧!
代码是这么写的:
$('.personal, .personMenu').hover(function () { var $ul=$(this).children().eq(1); if($ul.is(':hidden')){ $ul.show(); }else{ $ul.hide(); } });
然而………………事与愿违! 具体什么情况大家可以自己演示。
划重点,划重点!以后碰到这种尴尬的情况,你就
对他们的父亲操作就ok啦 。
阅读全文
1 0
- 2017/9/1前端小白的总结:关于hover的一个故事
- 关于jQuery中hover事件的一个小bug
- 一个关于博士的小故事
- 关于伪类hover的一些总结
- 一个学姐关于前端的总结
- 不知道标题了,一个关于人生的小故事
- 一个update的小故事
- 关于工作的小故事
- 关于财富的小故事
- 实现一个小的hover下拉列表_不算完整
- 一个前端小白的苦恼!
- 一个关于兔子的故事
- 一个关于Action的故事
- 一个关于猪的故事
- 一个关于中国菜的故事
- 关于一个小和尚的故事
- 一个关于 nolock 的故事
- li:hover的小知识
- naive Bayes example
- 《图灵程序设计丛书 算法》第4版.pdf
- 《Java核心技术 卷1 基础知识 原书第9版》pdf
- 数据库基础---关系数据库简介和关系代数8种运算方法及例题
- 《算法导论》pdf
- 2017/9/1前端小白的总结:关于hover的一个故事
- 《Python编程快速上手 让繁琐工作自动化》pdf
- 《计算机程序设计艺术》pdf
- 贝叶斯思维 统计建模的Python学习法pdf
- tensorflow(三):cnn验证码识别,开启tensorflow
- 1
- MySQL数据库基础与实例教程所有PPT
- MySQL异步复制延迟解决的架构设计与运维架构ppt
- ORACLE-数据库入门ppt