chrome中的滚动条答案

【问题标题】：scrollbars in chromechrome中的滚动条
【发布时间】：2011-07-12 13:45:29
【问题描述】：

为什么以下页面在 chrome 中为我提供滚动条，但在其他所有浏览器中都可以正常工作？

我正在粘贴所有内容，以防万一。虽然我认为它与 java 小程序无关，因为我在使用 flash 电影时遇到了同样的问题。

<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <title>Java</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script src="jquery-1.6.2.min.js"></script>
    <script type="text/javascript">

function getParameter(name, url)
{
    if(!url)
    {
        url = window.location.href;
    }
    var paramsStart = url.indexOf("?");

    if(paramsStart !== -1)
    {
        var paramString = url.substr(paramsStart + 1);
        var tokenStart = paramString.indexOf(name);

        if(tokenStart !== -1)
        {
            var paramToEnd = paramString.substr(tokenStart + name.length + 1);
            var delimiterPos = paramToEnd.indexOf("&");

            if(delimiterPos === -1)
            {
                return paramToEnd;
            }
            else
            {
                return paramToEnd.substr(0, delimiterPos);
            }
        }
    }
    return -1;
}

      $(document).ready( function()
      {
        var w = getParameter('width');
        var h = getParameter('height');
        var d = document.getElementById('javadiv'); 
        d.style.width = (w > 0) ? w+"px" : "100%";
        d.style.height = (h > 0) ? h+"px" : "100%";

        var main = getParameter("game");
        var mainclass = getParameter("mainclass");
        var gmain = main.substring(0,1).toUpperCase() + main.substring(1,main.length);

        var code = mainclass;


        var applet = '<applet id="applet" codebase="'+getParameter("base")+'" archive="applet.jar" code="'+code+'" width="100%" height="100%">';
        applet += "<param name='debug' value='"+getParameter("debug")+"' ></param>";
        applet += '</applet>';

        $(applet).appendTo("#javadiv");
      });
    </script>
    <style>
    html,body
    {
      width:100%; 
      height:100%;
      background-color:#000;
      margin:0;
      padding:0;
    }
    </style>
  </head>

  <body><div id="javadiv" style="width:100%;height:100%;"></div></body>
</html>

【问题讨论】：

我无法重现该问题。您能否发布一个指向工作示例的链接？

标签： javascript html flash google-chrome

【解决方案1】：

我想知道 Chrome 是否会在您设置为 100% 高度和宽度的 javadiv 中添加一些 margin 或 padding。

尝试重置div 上的margin 和padding。

【讨论】：

如果您将javadiv 设置为小于100% 的值会怎样？

【解决方案2】：

你可以使用overflow-x: hidden;或溢出-y：隐藏；取决于出现的滚动条。将其设置为 html 和 \ 或 body 应该隐藏任何出现的滚动条。

最有可能导致您的问题的罪魁祸首可能是特定于浏览器的样式表。我看到你有一个 100% 高和宽的元素，如果它周围的任何元素有填充或边距，你会得到滚动条。

【讨论】：