【发布时间】:2021-05-05 01:49:00
【问题描述】:
我正在尝试将 Responsive Menu 插件正确地实现到 wordpress 主题中。推送侧菜单打开时会出现此问题,这会导致body 在垂直滚动时移动。
目前,this template page 有一个解决方案,效果非常好,我对结果很满意。
问题: 考虑到Outsource WordPress 的回答,它修复了上面指定的页面,是否有可能调整下面的代码以便在其他模板页面中以更通用的方式使用,例如here 就像已经在运行here?
我认为.edge-ils-item-link 和.edge-ils-content-table 是变量,但我不知道如何处理和调整它,我已经做了一些测试来替换这些元素但没有积极的结果,也许它没有那么简单,它更多比起那个来说。我也知道edge-wrapper、edge-wrapper-inner、wpb_wrapper 在每个页面中都可以找到,这些可能是可以改变解决方案使其适用于每个页面的常见元素。
此外,根据最新版本准备好 jQuery 也很棒(此时我正在使用 jQuery migrate 1.4.1 和旧版本的 Wordpress,以便至少在设计的页面上正常运行)。
.scroll-lock{position:fixed !important;}
$(document).ready(function() {
var windowTop = 0;
var menuOpen = 0;
var offsetContainerList = 0;
$('#responsive-menu-pro-button').click(function() {
var offsetScrollList = $('.edge-ils-item-link:first').offset().top;
if ($('html').hasClass('scroll-lock')) {
$('#responsive-menu-pro-container').one("webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend",
function(event) {
if (menuOpen==0) {
menuOpen = 1;
$('html').removeClass('scroll-lock');
$('.edge-ils-content-table').css('top', eval(offsetContainerList)-40+'px'); //change image container top position
$('html').scrollTop(windowTop); //scroll to original position
}
else {
menuOpen = 0;
}
});
}
else {
windowTop = $(window).scrollTop();
offsetContainerList = $('.edge-ils-content-table').offset().top;
$('html').addClass('scroll-lock');
$('.edge-ils-content-table').css('top', -offsetScrollList + 'px'); //change image container top position
}
});
});
有问题的视频,如果这有助于here。
【问题讨论】:
-
你试过用插入页眉页脚插件在每一页添加代码吗?
-
这还没解决吗??
-
嘿,我绝对可以帮你解决这个问题,你能提供一个指向你网站的链接吗?
-
这看起来是一个简单的问题,但您只是没有给我们提供帮助您的工具,请提供您希望它工作的页面的干净示例(不添加任何代码) ,并解释预期的结果是什么,据我了解,当菜单打开时,您希望该权限不可滚动,并且文本保持原样?
-
再一次,你希望它工作的页面包含错误的代码,我们无法在不工作的页面上测试东西,创建一个新的示例页面,删除你尝试的 JS 代码有一个新的开始。
标签: javascript html jquery css wordpress