jQuery实现彩色导航菜单

昨天申请了这个博客，嘿嘿，挺开心的，决定将用这博客用来记录我的学习(前端)，虽然现在很少时间学习，虽然现在还是个菜鸟，但我相信一点一点的积累吧ぃぅアぃぅアぃぅアぃぅアぃぅアぃぅアぃぅア，你妹的 ，别说了，进入正题。

申请博客后就立马换了Goettinsprache这个模板，感觉比较简单比较清新，可是那颜色偶就不稀饭了，朱红色的，额，好像以前玩跑跑卡丁车时喜欢用这颜色 - - ，所以到后台看了一下，咦，发现居然可以自己添加代码，嘿，非常好，我就喜欢这样，所以用jquery帮导航菜单加工了一下，代码灰常的简单，小弟初学，大家别见笑 ^ ^。

jQuery(document).ready(function($) {
        var $menu_link = $('#navList li a');
        var $colour_arr = ['#F33298','#d544f6','#6835f9','#3a97fa','#3ff7f3','#54f7a8','#f8d52f','#fbb92e'];
        $menu_link.each(function(index){
            
                    $menu_link.eq(index).css({'border-color':$colour_arr[index],'color':$colour_arr[index]});
                
            });    
    function colorMenu () {
        $menu_link.each(
            function( intIndex ){
                $(this).hover (
                        function(){
                                $(this).css({'background':$colour_arr[intIndex],'color':'white'});
                        },
                        function(){
                            $(this).css({'background':'none','color':$colour_arr[intIndex]});
                            }
                    )
                }
         );    
    }
    colorMenu();
});

是吧，初学者的水平，就只是建立一个包含hex颜色的数组，然后通过遍历这个数组设置样式.........

在css里还加了渐变动画效果

#navList li a{
transition: 0.75s;
-webkit-transition: 0.75s;
-moz-transition: 0.75s;
-o-transition: 0.75s;
}

 

就跟介个页面菜单那样子。注意IE10以下浏览器不支持transition。看不到效果就说明出现下面的问题了。求解求解求解...thx

对了，我想问一下，为什么在页首html代码框里面加上我自己的js文件保存后没一会儿就自动不见了，保存了好几次了都这样，求大神们帮解。。如果有人看到的话。

博问地址：http://q.cnblogs.com/q/44231/  原来新人需要申请开通js权限，好吧，我明白了。。

<script type="text/javascript"> </script><script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>