我有一个JavaScript代码,它将在我的主题的index.php文件中的WordPress内容管理系统上运行(参见下面的javascript代码)。我已经成功地让滚动条工作了,但当我调整窗口大小时(当响应性开始时),横幅就会一直移到屏幕的左边。我曾认为,通过使用普通的div标记禁用JavaScript,响应性就会起作用。所以我想,如果我在包含标签的宽度小于600时禁用JavaScript,我就可以让它工作(通过简单地删除JavaScript)。它不起作用。
我不确定JavaScript解决方案是否是最好的解决方案。有人能帮上忙吗?欢迎任何建议……
<script type =
下面是html文件:
let element = document.getElementById("range");
let pic1 = document.getElementById("Pic1");
let pic2 = document.getElementById("Pic2");
element.addEventListener("click", function () {
pic1.offsetWidth = `${element.value}%`;
}, false)
<!DOCTYPE htm
我有两个引导列,它们在大屏幕上相邻,在小屏幕上堆叠在一起。它是有意设置的,所以右边的列在较小屏幕上的左边列的顶部。
问题:当在大屏幕上滚动时,列在y轴上正确地附加,但左列和右列都跳出并改变宽度。
查看js小提琴,向下滚动,您将看到问题。
<div class="col-md-3 col-md-push-9" id="right">
Right in wide screens, top on small screens
</div>
<div class="col-md-9 col-md-pull-3" id
我有这段代码(其中一些可能没有太多意义……),但这是我想要完成的。
1)使用window.matchMedia键确定屏幕的宽度2)基于媒体查询创建一个函数,该函数输出变量gridSize的值3)将该getGridSize函数传递到滑块的选项列表中。
我拥有的代码是
var mq = window.matchMedia( "(min-width: 500px)" );
var gridSize = getGridSize();
function getGridSize() {
if (mq.matches) {
// window width is at least