Question

我正在制作搜索栏叠加层，完成它并且它应该像我提供的Example一样工作。但是，如果我登录到WordPress或者我的Window with >588px，那么JS只能正常工作，那么它工作正常。

网站Tarson Pools点击搜索图标。

下面是我的JQuery代码（工作正常）：

//Created by Ryan Tarson, Please do not copy be original
jQuery(document).ready(function($) {
  var wHeight = window.innerHeight;
  console.log(wHeight);
  //search bar middle alignment
  $('#mk-fullscreen-searchform').css('top', wHeight / 2);
  //reform search bar
  jQuery(window).resize(function() {
    wHeight = window.innerHeight;
    $('#mk-fullscreen-searchform').css('top', wHeight / 2);
  });
  // Search
  $('#search-button').click(function() {
    console.log("Open Search, Search Centered");
    $("div.mk-fullscreen-search-overlay").addClass("mk-fullscreen-search-overlay-show");
  });
  $("a.mk-fullscreen-close").click(function() {
    console.log("Closed Search");
    $("div.mk-fullscreen-search-overlay").removeClass("mk-fullscreen-search-overlay-show");
  });
});

Answer 1

问题是使用搜索图标进行的类分配。删除行class: col-mw-3后，它运行正常，并在所有浏览器中。另外，请确保没有任何内容覆盖<a>标记！

JQuery只在一定的宽度上工作

1 个答案: