<!doctype html><html><head><meta charset="UTF-8"><title>Document</title><!-- <script type="text/javascript" src="public/jquery.superslide.2.1.1.js"></script><script type="text/javascript" src="public/jquery1.42.min.js"></script><script type="text/javascript" src="public/jquery-1.4.2.js"></script> --><script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js"></script><style type="text/css">*{margin: 0;padding: 0;}body{background: #333;}.addbg{background: #f90;}.cont{width: 1000px;height: auto;/*background: #0c1021;*/margin: 10px auto;position: relative;}.right{width: 200px;height: 400px;background: #00a0e9;position: fixed;left: 50%;top: 10px;margin-left: 300px;/*50%+margin-left: 共同定位*/}.right ul{list-style: none;margin-top: 4px;margin-left: 5px;width: 190px;height: 305px;}.right ul li{width: 190px;height: 50px;background: #333;}.right ul li :hover{background: #f90;color: #fff;animation:mychange 0.7s;-webkit-animation:mychange 0.7s;-moz-animation:mychange 0.7s;-o-animation:mychange 0.7s;}@keyframes mychange{from{background: #333}to{background: #f90}}@-webkit-keyframes mychange{from{background: #333}to{background: #f90}}@-moz-keyframes mychange{from{background: #333}to{background: #f90}}@-o-keyframes mychange{from{background: #333}to{background: #f90}}.right ul li a{display: block;width: 190px;height: 50px;text-align: center;text-decoration: none;margin-top: 1px;font: 14px Helvetica;line-height: 50px;color: #00b7ee;}.left{background: #ddd;width: 799px;height: auto;position: relative;left: 0;top: 0;padding-bottom: 5px;padding-top: 15px;overflow: hidden;}.left div{width: 745px;height: 400px;background: #333;margin: 0px 27px 10px 27px;}.left{color: #088;line-height: 400px;text-indent: 30px;font: 50px Helvetica;font-weight: bold;letter-spacing: -2px;}.home{margin-top: 10px;}</style></head><body><div><div><div id="home">Home</div><div id="blog">Blog</div><div id="contact">Contact</div><div id="about">About</div><div id="pictures">Pictures</div><div id="profit">Profit</div></div><div><ul><li id="link1"><a href="javascript:">Home</a></li><li id="link2"><a href="javascript:">Blog</a></li><li id="link3"><a href="javascript:">Contact</a></li><li id="link4"><a href="javascript:">About</a></li><li id="link5"><a href="javascript:">Pictures</a></li><li id="link6"><a href="javascript:">Profit</a></li></ul></div></div><script type="text/javascript">$("#link1").click(function(){$("body,html").animate({"scrollTop":"25px"})$(this).addClass("addbg").siblings().removeClass("addbg")})$("#link2").click(function(){$("body,html").animate({"scrollTop":"435px"})$(this).addClass("addbg").siblings().removeClass("addbg");})$("#link3").click(function(){$("body,html").animate({"scrollTop":"845px"})$(this).addClass("addbg").siblings().removeClass("addbg");})$("#link4").click(function(){$("body,html").animate({"scrollTop":"1255px"})$(this).addClass("addbg").siblings().removeClass("addbg");})$("#link5").click(function(){$("body,html").animate({"scrollTop":"1665px"})$(this).addClass("addbg").siblings().removeClass("addbg");})$("#link6").click(function(){$("body,html").animate({"scrollTop":"2075px"})$(this).addClass("addbg").siblings().removeClass("addbg");})</script></body></html>这个Demo折磨了我一个下午,特来求助。在right导航部分,请问我addClass的addbg为什么不起作用?右边的点击之后不变色是怎么回事呢亲
添加回答
举报
0/150
提交
取消