收藏本站腾讯微博新浪微博

经典论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

蓝色理想 最新研发动态 网站开通淘帖功能 - 蓝色理想插件 论坛内容导读一页看论坛 - 给官方提建议

论坛活动及任务 地图和邮件任务 请多用悬赏提问 热夏来袭,选一款蓝色理想的个性T恤吧!

手机上论坛,使用APP获得更好体验 急需前端攻城狮,获得内部推荐机会 论坛开通淘帖功能,收藏终于可以分类了!

搜索
查看: 2087|回复: 4

新手请教,为什么我扣下来的的JS导航,chrome和IE显示完全不对呢?

[复制链接]
发表于 2011-10-27 22:34:39 | 显示全部楼层 |阅读模式
本帖最后由 shaohuaa 于 2011-10-27 22:35 编辑

新手请教,为什么我扣下来的的JS导航,chrome和IE显示完全不对呢?
不兼容IE内核?
还请老师们指导

CHROME正常显示:
正常显示.jpg

IE错误显示:
错误显示.jpg

补充内容 (2011-10-27 22:40):
http://www.138mv.com/allmovie.html  不是广告!!!!!

补充内容 (2011-10-27 22:40):
再补上一句就是:错误演示
发表于 2011-10-27 23:13:10 | 显示全部楼层
是不是你扣代码的时候把ie6的hack给搞没了?
回复 支持 反对

使用道具 举报

 楼主| 发表于 2011-10-27 23:22:24 | 显示全部楼层
应该是CSS的问题
还请各位大大明示,小弟我一直在线等
回复 支持 反对

使用道具 举报

 楼主| 发表于 2011-10-27 23:28:40 | 显示全部楼层
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title></title>
    <style>
body { font-family:Arial, Helvetica, Sans-Serif; font-size:12px; margin:0px 20px; }
/* menu */
        #menu { margin:0px; padding:0px; list-style:none; color:#fff; line-height:45px; display:inline-block; float:left; z-index:1000; }
#menu a { color:#fff; text-decoration:none; }
#menu > li { background:#172322 none repeat scroll 0 0; cursorointer; float:left; position:relative; padding:0px 10px; }
#menu > li a:hover { color:#B0D730; }
#menu .logo { background:transparent none repeat scroll 0% 0%; padding:0px; background-color:Transparent; }
/* sub-menus*/
        #menu ul { padding:0px; margin:0px; display:block; display:inline; }
#menu li ul { position:absolute; left:-10px; top:0px; margin-top:45px; width:150px; line-height:16px; background-color:#172322; color:#0395CC; /* for IE */ display:none; }
#menu li:hover ul { display:block; }
#menu li ul li { display:block; margin:5px 20px; padding: 5px 0px; border-top: dotted 1px #606060; list-style-type:none; }
#menu li ul li:first-child { border-top: none; }
#menu li ul li a { display:block; color:#0395CC; }
#menu li ul li a:hover { color:#7FCDFE; }
/* main submenu */
        #menu #main { left:0px; top:-20px; padding-top:20px; background-color:#7cb7e3; color:#fff; z-index:999; }
/* search */
        .searchContainer div { background-color:#fff; display:inline; padding:5px; }
.searchContainer input[type="text"] { border:none; }
.searchContainer img { vertical-align:middle; }
/* corners*/
        #menu .corner_inset_left { position:absolute; top:0px; left:-12px; }
#menu .corner_inset_right { position:absolute; top:0px; left:150px; }
#menu .last { background:transparent none repeat scroll 0% 0%; margin:0px; padding:0px; border:none; position:relative; border:none; height:0px; }
#menu .corner_left { position:absolute; left:0px; top:0px; }
#menu .corner_right { position:absolute; left:132px; top:0px; }
#menu .middle { position:absolute; left:18px; height: 20px; width: 115px; top:0px; }
</style>
    </head>
    <body>
<div style="margin-left:50px;">
      <ul id="menu">
    <li class="logo"> <img style="float:left;" alt="" src="menu_left.png"/>
          <ul id="main">
        <li>Welcome to <b>Create Vimeo-like top navigation</b> tutorial!</li>
        <li class="last"> <img class="corner_left" alt="" src="corner_blue_left.png"/> <img class="middle" alt="" src="dot_blue.png"/> <img class="corner_right" alt="" src="corner_blue_right.png"/> </li>
      </ul>
        </li>
    <li><a href="#">Login</a> </li>
    <li><a href="#">Help</a>
          <ul id="help">
        <li> <img class="corner_inset_left" alt="" src="corner_inset_left.png"/> <a href="#">General help</a> <img class="corner_inset_right" alt="" src="corner_inset_right.png"/> </li>
        <li><a href="#">牛图库</a></li>
        <li><a href="#"><i>牛</i><font color="#FF0000">图</font><b>库</b></a></li>
        <li class="last"> <img class="corner_left" alt="" src="corner_left.png"/> <img class="middle" alt="" src="dot.gif"/> <img class="corner_right" alt="" src="corner_right.png"/> </li>
      </ul>
        </li>
    <li class="searchContainer">
          <div>
        <input type="text" id="searchField" />
        <img src="magnifier.png" alt="Search" onclick="alert('You clicked on search button')" /></div>
          <ul id="search">
        <li> <img class="corner_inset_left" alt="" src="corner_inset_left.png"/>
              <input id="cbxAll" type="checkbox" />
              All <img class="corner_inset_right" alt="" src="corner_inset_right.png"/> </li>
        <li>
              <input id="Articles" type="checkbox" />
              Articles</li>
        <li>
              <input id="Tutorials" type="checkbox" />
              Tutorials</li>
        <li>
              <input id="Reviews" type="checkbox" />
              Reviews</li>
        <li>
              <input id="Resources" type="checkbox" />
              Resources</li>
        <li class="last"> <img class="corner_left" alt="" src="corner_left.png"/> <img class="middle" alt="" src="dot.gif"/> <img class="corner_right" alt="" src="corner_right.png"/> </li>
      </ul>
        </li>
  </ul>
      <img style="float:left;" alt="" src="menu_right.png"/> </div>

<div style="width:98%;margin:20px auto; padding:50px 0; clear:both; overflow:hidden;">
<p><strong><a href="http://js.niutuku.com" target="_blank">牛图库整理</a></strong> </p>
<p></p>
<p>转载请自觉注明出处!注:此代码仅供学习交流,请勿用于商业用途。</p>
</div>

</body>
</html>


原代码在IE6的状态就出错。
回复 支持 反对

使用道具 举报

发表于 2011-10-27 23:46:26 | 显示全部楼层
这个下拉菜单我用过,是纯css的。
我确信楼主你少了ie6的hack。

http://www.jb51.net/article/16666.htm
这应该完整的代码。你自己看吧。
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则

QQ|小黑屋|Archiver|手机版|blueidea.com ( 湘ICP备12001430号 )  

GMT+8, 2020-12-4 16:12 , Processed in 0.128584 second(s), 11 queries , Gzip On, Memcache On.

Powered by Discuz! X3.2 Licensed

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表