segmentfault首页右侧的“传送门”,鼠标光标停留时会出现一个弹出菜单,是如何实现的?

Viewed 3765

“传送门”是个链接:

<a href="http://0x.segmentfault.com/">传送门</a>

弹出页面是一个div:

<div class="hole-list">
    <a href="http://segmentfault.com/"><img src="http://s.segmentfault.com/img/icon/auth-sf.png" alt="" />SegmentFault 主站</a>
    <a href="http://101.segmentfault.com/"><img src="http://sfault-avatar.b0.upaiyun.com/261/411/2614115123-i-1140000000142909_icon" alt="" />101 新手上路</a>
    <a href="http://0x.segmentfault.com/"><img src="http://sfault-avatar.b0.upaiyun.com/958/931/958931179-i-1140000000145939_icon" alt="" />建议反馈</a>
    <a href="http://hackathon.segmentfault.com/"><img src="http://sfault-avatar.b0.upaiyun.com/332/160/3321600847-i-1140000000145114_icon" alt="" />黑客马拉松</a>
</div>

一般情况下弹出菜单是通过处理onmouseover和onmouseout事件实现的,但是传送门的链接没有绑定任何javascript事件,hover的css也只是修改了背景色,那么是什么修改弹出菜单div的display属性,让这个div显示出来了呢?

1 Answers

是css实现的 传送门所在的li有个id 对应有hover的css属性

不 解 决

看到你说的css了,#wormhole:hover .hole-list{display:block},不过IE不支持非a:hover的情况,是怎么解决的?