JQuery实现仿宝马中国的菜单效果[原创]

是否有人见过宝马中国网站的页面(http://www.bmw.com.cn/zh/index_narrowband.html),它的菜单效果是比较好看的,我曾分析过它的脚本,复杂无比,干脆自己模仿它的效果用JQuery写一个算了。

JQuery实现仿宝马中国的菜单效果[原创]

下面是我很早之前的实现的效果,虽然比起宝马中国的,还差很多,但揍合着用吧。
JQuery实现仿宝马中国的菜单效果[原创]

要实现这种效果,我首选JQuery,因为它小而强大。废话少说,先给出Html代码:

Code

下面是样式:
Code
下面是最重要的Js代码了
Code

 

由于上面做了比较详细的注释,加上代码本身简单易懂,我就不做说明了。
不过,还遗留一点Bug,就是当鼠标移开,菜单隐藏时,我是将背景颜色写成跟背景一样的,所以如果要换背景时,不需要改这个地方,扩展性比较差,请高手提一下意见。

代码下载

你可能感兴趣的:(jquery)