【问题标题】:Blue Menu does not appear during Pop Up in Chrome在 Chrome 中弹出时不会出现蓝色菜单
【发布时间】:2013-12-06 04:07:40
【问题描述】:

在我们公司的网站http://exciga.com/Services.php# 上,当单击右侧的任何服务(例如:IT 治理图像)时,会弹出一个窗口,其中包含有关 IT 治理的信息以及左侧的蓝色菜单边。这个蓝色菜单可以在 IE 10 中看到,但在 Chrome 中看不到。请帮忙,因为我不知道我做错了什么:-)

我面临的第二个问题是在服务列表中。当我单击服务列表(例如:IT Governance 附近的“+”号)时,我会得到与其相关的服务列表。如您所见,这里的字体不同。我无法放置与服务列表标题(“IT 治理”)中相同的字体。如果我尝试进行更改,整个网页的字体都会更改。我希望下拉列表中的字体与服务列表标题中的字体相同 ÏT Governance +" 希望我对你们很清楚。

最后,如果我在浏览器中放大和缩小,确保对象大小不变的语法是什么。

【问题讨论】:

    标签: javascript jquery html css google-chrome


    【解决方案1】:

    蓝色菜单实际上存在于 Chrome 中。只是它被弹出窗口的大小隐藏了:<div class="popupbox3_pm" id="popuprel3" style="display: block; margin-top: -355px; margin-left: -380px;">,这是它的父元素。因为这个<div>position: fixed; 和设定的宽度/高度,所以超出其尺寸的任何东西都会被切割。

    我不太清楚为什么蓝色菜单上的z-index: 999 没有将它设置在它周围的黑色空间之上。这可能与元素在 HTML 中的位置有关。此外,它应该具有比黑色渐变框更高的 z 元素,后者具有 z-index: 9999;

    【讨论】:

    • 我同意,只需检查 IE10 和 Chrome v.31 并且存在蓝色菜单并且显示方式相同。
    • 谢谢大家。世界有你这样的好人。
    • 先生们,经过几次尝试和错误,它无法正常工作。请您好心让我知道您希望我为这两个问题做什么。我正在使用 IE10 和 Chrome v.31,但蓝色菜单未在 Chrome 中显示.....谢谢。
    【解决方案2】:

    首先修复<head>部分,你已经包含了多个jQuery库,如果你的插件可以使用最新的jQuery(你应该测试它)那么我建议你下载jQuery 1.10.2把它放在你的js文件夹中并替换<script src="js/jquery-1.6.js" ></script><script src="js/jquery-1.10.2.min.js"></script>


    现在用这个新元素替换你的 <head> 元素,祝你好运;)我并不是说这会解决你的问题。

    <head>
    
      <title>Exciga</title>
    
      <meta charset="utf-8">
      <meta name="description" content="Write short description of your site here.">
      <meta name="keywords" content="write, site, keywords, here, like, this, comma, delimited">
      <meta name="author" content="Name of the site author">
    
      <link rel="stylesheet" href="css/style.css">
      <link rel="stylesheet" href="css/style2.css"> <!-- Why style2.css ? Is this another style for entire site or you could merge style.css with style2.css ? -->
      <link rel="stylesheet" href="css/reset.css">
      <link rel="stylesheet" href="css/layout.css">
      <link rel="stylesheet" href="css/hover/style_common.css">
      <link rel="stylesheet" href="css/hover/style2.css">
      <link rel="stylesheet" href="css/jquery.akordeon.css">
      <link rel="stylesheet" href="css/demo.css">
      <link rel="stylesheet" href="popup/style.css">
      <link rel="stylesheet" href="assets/application-d7d505356b55e600106ef945bd484e9f.css">
    
      <script src="js/jquery-1.6.js"></script>
    
      <!-- These scripts you can/should put just before the </body> tag, if after that some elements lose functionality then put that script again in the <head> section -->
      <script src="js/atooltip.jquery.js"></script>
      <script src="js/jquery.akordeon.js"></script>
      <script src="js/cufon-yui.js"></script>
      <script src="js/cufon-replace.js"></script>  
      <script src="js/Vegur_300.font.js"></script>
      <script src="js/PT_Sans_700.font.js"></script>
      <script src="js/PT_Sans_400.font.js"></script>
      <script src="popup/custom.js"></script>
      <script src="assets/application-aa8aaa30c70f4a42013dec916e9b29b0.js"></script>
      <script>
        $(function() {
          $('#buttons').akordeon();
             $('#button-less').akordeon({ buttons: false, toggle: true, itemsOrder: [0, 1,2,3,4,5,6,7] });
          });
      </script>
      <!-- End of scripts -->
    
      <!--[if lt IE 9]>
        <script type="text/javascript" src="js/html5.js"></script>
        <link rel="stylesheet" href="css/ie.css" type="text/css" media="all">
      <![endif]-->
      <!--[if lt IE 7]>
        <div style="clear: both; text-align:center; position: relative;">
          <a href="http://windows.microsoft.com/en-US/internet-explorer/products/ie/home?ocid=ie6_countdown_bannercode">
            <img src="http://storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today." />
          </a>
        </div>
      <![endif]-->
    
    </head>
    

    更新: 关于Service Listsfont-family 打开style.css 并在下面插入代码,然后根据您的需要更改字体系列和大小。

    .responsive,
    .responsive-half {
      font-family: Verdana !important;
      font-size: 16px !important;
    }
    

    【讨论】:

    • 感谢大家的快速回复。很快就会看看。
    猜你喜欢
    • 2015-04-12
    • 1970-01-01
    • 1970-01-01
    • 2014-08-19
    • 2011-09-14
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多