附上代码<script type="text/javascript" src="script/jquery-1.6.4.min.js"></script>
<script type="text/javascript">
$(function(){
var a=100;
var index=0;
$(".game_hand").next(".game_content").css({"width":"0px"}).hide();
$(".game_hand:eq(0)").next(".game_content").css({"width":"150px"}).show();

$(".bd .game_hand").mouseover(function(){
if($(".bd .game_content").eq(index).css("width")!="150px")return false;
i=$(".bd .game_hand").index(this);
if(i==index)return false;
$(".bd .game_content").eq(index).animate({width:0},300).hide(a+=0);
$(this).next().animate({width:150},300).show();
index=i;
});
});
</script>
附图
页面加载时的图片鼠标移动到系统介绍时的图片移到特色玩法时的图片移到论坛交流时的图片我在火狐 谷歌下浏览没有问题
在IE6下就出现了上面的问题
请大神指点jquery

解决方案 »

  1.   

    附上代码<div id="game_data">
    <h2></h2>
    <div class="bd">
    <div class="game_hand">
    <img src="img/xszn.jpg" />
    </div>
    <div class="game_content">
    <ul>
    <li><a href="#">《悟空来了》护法玩法</a></li>
    <li><a href="#">《悟空来了》战斗系统</a></li>
    <li><a href="#">《悟空来了》职业介绍</a></li>
    <li><a href="#">《悟空来了》游戏背景</a></li>
    <li><a href="#">《悟空来了》游戏介绍</a></li>
    </ul>
    </div>
    <div class="game_hand">
    <img src="img/xtjs.jpg" />
    </div>
    <div class="game_content">
    <ul>
    <li><a href="#">《悟空来了》装备系统介绍</a></li>
    <li><a href="#">《悟空来了》邮件系统介绍</a></li>
    <li><a href="#">《悟空来了》任务系统介绍</a></li>
    <li><a href="#">《悟空来了》聊天系统介绍</a></li>
    <li><a href="#">《悟空来了》好友系统介绍</a></li>
    <li><a href="#">《悟空来了》地图系统介绍</a></li>
    <li><a href="#">《悟空来了》背包系统介绍</a></li>
    </ul>
    </div>
    <div class="game_hand">
    <img src="img/tswf.jpg" />
    </div>
    <div class="game_content">
    <ul>
    <li><a href="#">《悟空来了》帮派系统介绍</a></li>
    <li><a href="#">《悟空来了》幻化系统介绍</a></li>
    <li><a href="#">《悟空来了》酒馆系统介绍</a></li>
    <li><a href="#">《悟空来了》挂机系统介绍</a></li>
    <li><a href="#">《悟空来了》万劫塔</a></li>
    <li><a href="#">《悟空来了》副本系统</a></li>
    </ul>
    </div>
    <div class="game_hand">
    <img src="img/ltjl.jpg" />
    </div>
    <div class="game_content">
    <ul>
    <li><a href="#">关于宇文成都的技能讨论</a></li>
    <li><a href="#">非R玩家打造极品肉盾宝宝</a></li>
    <li><a href="#">非RMB玩家如何过精英副本</a></li>
    <li><a href="#">《悟空来了》金卷的用途</a></li>
    <li><a href="#">如何提高BOSS活动的奖励</a></li>
    <li><a href="#">浅谈吕洞宾之技能吕祖剑法</a></li>
    <li><a href="#">非RMB玩家580副本肉盾</a></li>
    <li><a href="#">说说人族的橙将军衔</a></li>
    </ul>
    </div>
    </div>
    </div>
      

  2.   

    我的代码就引用了一个js    jquery-1.6.4.min.js
    好像谈不上有冲突啊!
      

  3.   

    你仔细查下 HTML  你这边写了一个  
        
    $(".game_hand").next(".game_content").css({ "width": "0px" }).hide();是不是你的元素的结尾没弄好,导致后面都被隐藏了
      

  4.   


    <style type="text/css">
    body{ font-size:12px;}
    *{ margin:0; padding:0;}
    ul li{ list-style-type:none;}
    #game_data{ width:748px;}
    #game_data h2{ height:49px; background:url(img/title.jpg) no-repeat;}
    #game_data .bd{ background:#2F0304; width:728px; padding:5px 10px 0 10px; height:281px; overflow:hidden;}
    #game_data .game_hand{ width:116px; float:left; margin:0 14px; display:inline;}
    #game_data .game_content{ float:left; width:150px; margin:30px 0 0 0; height:235px;}
    #game_data .game_content ul{ width:150px; height:235px;}
    #game_data .game_content ul li{ height:28px; line-height:28px; overflow:hidden;}
    #game_data .game_content ul li a{ color:#A95658; text-decoration:none;}
    #game_data .game_content ul li a:hover{ color:#F00;}
    </style>
      

  5.   


    <style type="text/css">
    body{ font-size:12px;}
    *{ margin:0; padding:0;}
    ul li{ list-style-type:none;}
    #game_data{ width:748px;}
    #game_data h2{ height:49px; background:url(img/title.jpg) no-repeat;}
    #game_data .bd{ background:#2F0304; width:728px; padding:5px 10px 0 10px; height:281px; overflow:hidden;}
    #game_data .game_hand{ width:116px; float:left; margin:0 14px; display:inline;}
    #game_data .game_content{ float:left; width:150px; margin:30px 0 0 0; height:235px;}
    #game_data .game_content ul{ width:150px; height:235px;}
    #game_data .game_content ul li{ height:28px; line-height:28px; overflow:hidden;}
    #game_data .game_content ul li a{ color:#A95658; text-decoration:none;}
    #game_data .game_content ul li a:hover{ color:#F00;}
    </style>
    应该是748宽度小吧,你调大些看看
      

  6.   


    <style type="text/css">
    body{ font-size:12px;}
    *{ margin:0; padding:0;}
    ul li{ list-style-type:none;}
    #game_data{ width:748px;}
    #game_data h2{ height:49px; background:url(img/title.jpg) no-repeat;}
    #game_data .bd{ background:#2F0304; width:728px; padding:5px 10px 0 10px; height:281px; overflow:hidden;}
    #game_data .game_hand{ width:116px; float:left; margin:0 14px; display:inline;}
    #game_data .game_content{ float:left; width:150px; margin:30px 0 0 0; height:235px;}
    #game_data .game_content ul{ width:150px; height:235px;}
    #game_data .game_content ul li{ height:28px; line-height:28px; overflow:hidden;}
    #game_data .game_content ul li a{ color:#A95658; text-decoration:none;}
    #game_data .game_content ul li a:hover{ color:#F00;}
    </style>
    应该是748宽度小吧,你调大些看看
    感谢大哥解决了我的问题,是宽度小了