Question

在浏览器宽度缩小时, 我在我的网站上应用了这个 javascript 来隐藏某个元素。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $(window).bind("resize", function() {
            $( #slideshow ).toggle($(this).width() >= 960);  
        }).trigger("resize");
    });
</script>

但是在移动浏览器中,它可以在删除前快速显示元素。有人知道如何解决这个问题吗?

Answer 1

您的代码在文档准备就绪前不会运行; 意思是您会简要看到元素, 直到 < code> document. ready 方法在 jQuery 中被发射。您可以使用代码隐藏元素并将其直接放置到元素后面, 从 < code> 文件中删除。 ready carper 。

<div id="slideshow"></div>
<script>
    $( #slideshow ).toggle( $(window).width() >= 960 );
</script>

或者,您可以在默认情况下隐藏元素,并在符合适当条件时向 JavaScript 显示该元素。

<style>#slideshow { display: none }</style>

<div id="slideshow"></div>

<script>
    $( #slideshow ).toggle( $(window).width() <= 960 );
</script>

Answer 2

Have you tried twitter bootstrap solution for this? http://twitter.github.com/bootstrap/scaffolding.html

友情链接