豆瓣电影首页的分析

网址 http://movie.douban.com

1 先上图
豆瓣电影首页的分析
下面4附图的onmouseover事件会悬空触发图片介绍div 并且它每一屏的第4个li的介绍是在外面的 一般的做法是将图片介绍div绑定在ul下的li标签内 (有内在的逻辑)但是可以知道图片是在不断向左滚动的,那么就必须在unordered list(<ul>)外套一个元素使多出的ul隐藏,但隐藏ul也会隐藏介绍div 故不能这么做 必须逃脱中间兰的限制  所以把它放在了最后,通过appendChild的形式进行显示
先获取每一个li的绝对left top 再在它的基础上设介绍div的位置
注意到有延迟显示  故代码中有setTimeout
2 右上角douban app onmouseover 居然只显示了一部分  其实可以看做是一个矩形除去右上角的登陆注册  故把登陆注册设为z-Index :10 即可有这种效果

你可能感兴趣的:(分析)