jquery插件lavalamp实现绚丽的导航效果
大家都看到过有flash实现的绚丽的导航效果就是当鼠标移动到导航菜单某个选项上时,有个背景阴影滑行到该菜单项下!这种导航效果非常吸引人,但是大家知道用flash实现的导航对于搜索引擎是不够友好!所以大都推荐不让使用。因为一个网页的导航菜单对于整个网站的优化方面有着至关重要的影响。可想而知当搜索引擎到达您的网站爬行的时候找不到您的导航目录,这对于蜘蛛爬行你的网站造成很大的障碍。下面我们就介绍一款jquery插件lavalamp来实现上述效果而导航形式完全可以用css来控制,导航内容为文字。这样既解决了seo问题也实现了导航的美化问题。可以说是得到了完美的解决。好了下面我们就用lavalamp来实现上述的效果。
首先html代码如下:<ul class=”lavalamp”>
<li><a href=”#”>首页</a></li>
<li><a href=”#”>jquery</a></li>
<li><a href=”#”>fireworks</a></li>
<li><a href=”#”>flash</a></li>
</ul>
jquery代码如下:<script type=”text/javascript”> $(function() { $(“.lavaLamp”).lavaLamp({ fx: “backout”, speed: 800 })}); </script>
(提示一下在写jquery代码之前要引进lavalamp.js文件easing.js和jquery.js文件)
留言
You must be 登录 发表评论.