1

我正在尝试制作一个模式窗口，该窗口将在单击链接后出现。最初显示一个掩码以填满整个屏幕，然后使用 jQuery 的 fadeIn() 方法显示模态窗口。它在 FF、Opera、Safari 甚至 IE 中运行良好（有一些小评论：）。然而问题在于，在可视化过程中，Chrome 中的滚动条在完全可见之前以不同的颜色出现，例如黄色、红色和黑色。有没有办法避免这种情况发生？

我的html代码是：

<a href="#dialog" name="modal">Simple Window Modal</a>

<div id="dialog">
    <div id="file"><div style="height:500px;"></div></div>
</div>

<div id="mask"></div>

jQuery代码：

$().ready(function() {

    $('a[name=modal]').click(function(e) {

        e.preventDefault();

        var id = $(this).attr('href');

        var maskHeight = $(document).height();
        var maskWidth = $(window).width();

        $('#mask').css({'width':maskWidth,'height':maskHeight});

        $('#mask').fadeIn(500);
        $('#mask').fadeTo("fast", 0.9);

        $('#mask').show();

        var winH = $(window).height();
        var winW = $(window).width();

        $(id).css('top',  winH/2-$(id).height()/2);
        $(id).css('left', winW/2-$(id).width()/2);

        $(id).fadeIn(500);

    });
});

结果：

Google Chrome 中的黑色滚动条 http://www.strangerstudio.net/demo/chrome-scrollbars-1.png

有一些内容：

Google Chrome 中的黄色滚动条 http://www.strangerstudio.net/demo/chrome-scrollbars-2.png

非常感谢！

编辑：当时可能无法避免这种不需​​要的效果，因为即使是 chrome://chrome/settings/ 中带有滚动条的弹出窗口也有它。

4

0 回答 0