Question

我正在使用名为弹球的w3layouts主题这里是theme的链接，我正在尝试添加搜索，是的我能够添加搜索到它，但我在搜索时遇到的问题是当你要搜索音乐时它确实会显示音乐的结果，但你必须向下滚动才能看到结果，结果之间存在很大的差距，这是主要的问题，我希望结果显示在菜单下面任何这里的帮助将是http://jsfiddle.net/nxfe7r29/3/

的链接

问题的屏幕截图

http://prntscr.com/6618e4

输入HTML

<form>
    <input id="search" type="text" /><input type="submit" value="" />
</form>

的Javascript

var search = $("#search");
var listItems = $("li");

search.on("keyup", function() {
  var terms = search.val();
  if (terms == '') {
    listItems.show();
  } else {
    listItems.hide(); 
    $("li:contains('" + terms + "')").show();
  }
});

Answer 1

这样做是因为应用了内联样式。所有这些“卡片”都设置为position: absolute内嵌样式。这意味着它们被固定在页面上的那个确切位置。

因此，当您开始搜索“生活”或“电影”时，它会隐藏页面上的其他元素（display: none使用jQuery的hide()。）。但是你必须向下滚动，因为这些元素绝对位于文档的较低位置，并且它们不会向上移动。

至于解决方案：这取决于您对JavaScript的熟悉程度。编辑主题文件。

在主题文件的某处，有一些逻辑可以绝对定位这些元素。应该使用不同的方法。这可能涉及主题重新设计取决于它是如何完成的。
查看搜索模式主题中是否缺少选项/设置。
选择不同的主题
雇用某人为你做这些事情之一：）

Answer 2

我认为你需要重写你的javascript代码。

Wookmark Jquery插件正在组织块。您必须根据他们的规则编写代码： https://github.com/GBKS/Wookmark-jQuery

他们的过滤器可以解决您的问题

搜索输入问题显示滚动

2 个答案: