Question

我在我的网站上使用360产品轮换，我希望轮换为浏览器的50％，然后在低于1000px时为100％。但是我无法使用媒体查询，因为HTMl中使用了样式/规则。像这样;

<div id="Frame" style="width:100vw;  margin:auto; background-repeat:no-repeat; background-position:center;"></div>

<script type="text/javascript">                 
    $('#Frame').animate360({
         centerInWindow:false, 
         xmlPath: './360-light-1/', 
         objPath: './360-light-1/Images/',
         iconPath: './360-light-1/HTML5/Images/'
    });
</script>

我尝试在css中使用#Frame标签，但它没有用。有什么办法可以在html中设置断点吗？

Answer 1

你可以使用@media queries。

在页面底部包含以下脚本：

<script>

function initialiseFrame() {
var frame = document.getElementById('frame');
frame.removeAttribute('style');
}

window.addEventListener('load',initialiseFrame,false);

</script>

这将从#frame中删除内嵌样式，以便随后不会覆盖任何@media query样式。

当我无法使用css时，如何设置特定于设备的视口宽度？

1 个答案: