Question

我一直在处理一个页面，我想根据屏幕空间的大小以编程方式在封面幻灯片中设置CSS属性。如果页面少于一个边界号，我不想激活幻灯片。如果页面的宽度大于该边界数，但小于另一个阈值，我希望幻灯片缩小，并缩小更小的尺寸。最后，如果它大于两者，我想将幻灯片放在其逻辑容器中水平居中。

http://JonathansCorner.com/blacksmiths-forge/experimental.html的来源有：

<iframe id="slideshow" border="0" frameborder="0" frameborder="no"
style="display: none;" width="318" height="424" src="/book_covers.cgi?width=318" />

http://JonathansCorner.com/css/combined.css处的CSS有：

#slideshow
    {
    height: 424px;
    position: fixed;
    top: 240px;
    right: 190px;
    width: 318px;
    }

JavaScript，http://JonathansCorner.com/js/combined.js：

if (jQuery(window).width() > 1200)
    {
    if (jQuery(window).width() > 1300)
        {
        var width = min(jQuery(window).width() - 1200, 318);
        document.getElementById('slideshow').src = "/book_covers.cgi?width=" +  width;
        document.getElementById('slideshow').width = width + 'px';
        document.getElementById('slideshow').width = width;
        jQuery('#slideshow').css('right', jQuery(window).width() - 1200 - 318);
        jQuery('#slideshow').css('display', 'block');
        }
    }

我走进去的心理模型是jQuery.css（）将是一张王牌，在我迄今为止尝试过的排列中，我从未意识到jQuery.css已经发生了变化

我也尝试使用例如jQuery('#slideshow').css('display', 'block !important')。

有什么方法可以使用jQuery（或单独的JavaScript）来设置属性以便它们坚持下去？

（我最初的理解有什么问题，关于DOM节点样式和属性的编程设置可以做什么和不能做什么的真相？）

Answer 1

您还没有关闭iframe标记，从未加载combined.js。 iframe不是自动关闭标签，它们需要一个开始和结束标签。

<iframe></iframe>

如何让jQuery.css（）胜过样式表呢？

1 个答案: