有人可以帮助解释为什么以下代码无效吗?我似乎无法弄清楚为什么......对我来说,一切都应该有效。
jQuery(window).load(function($){
if (window.matchMedia("(min-width: 768px)").matches) {
var sideHeight = $('.mainContent').css('height');
$('.sidebar').css('height', sideHeight);
}
});
这是一个只有CSS部分的jsfiddle,它可以工作。 https://jsfiddle.net/24r9cax6/
我通过在该函数中发出警报来测试媒体匹配部分,我可以在window.load上弹出警报,但CSS代码不起作用。我从来没有能够在我的网站上运行CSS代码并使我的侧边栏与主要内容的高度相同。我将js放在头部和身体的末端。没有变化。
该网站是用WP构建的。内容是动态加载的,所以我认为它在内容加载之前就已经达到了高度,但这就是window.load()应该修复的内容,对吧?
以下是您可以查看的网站上的文章。我希望侧边栏与mainContent div的高度相同,因此灰色背景继续向下移动。但仅限于平板电脑尺寸和使用(使用引导程序)。
http://www.businesstransitionandexitplanning.com/turning-business-income-into-retirement-income/
答案 0 :(得分:1)
您无法将$
传递给.load()
,并将其视为将$
传递给.ready()
。你需要包装整个函数:
(function($){
$(window).load(function(){
if (window.matchMedia("(min-width: 768px)").matches) {
var sideHeight = $('.mainContent').css('height');
$('.sidebar').css('height', sideHeight);
}
});
})(jQuery);