Question

问题（TL; DR）：
如何使Google自定义搜索“自动完成”建议弹出窗口相对于其所在的粘性菜单栏位置？

我的网站上有一个粘性标题菜单，标题中有一个Google自定义搜索框。例如

<div class="gcse"><gcse:searchbox-only resultsUrl="link to results page" enableHistory="true" enableAutoComplete="true"></gcse:searchbox-only></div>

当我将Google自定义搜索搜索框的自动完成建议弹出窗口更改为位置：相对或位置：粘性时，它会从页面上消失。我以为这可能与Google自定义搜索有关，而不是输出包装在其自身div中的自动填充建议表。这是我在查看源代码时看到的。

<table cellspacing="0" cellpadding="0" class="gstl_50 gssb_c" style="width: 262px; top: 95px; position: absolute; text-align: left; left: 358px; display: none;" dir="ltr"><tbody><tr><td class="gssb_f"></td><td class="gssb_e" style="width: 100%;"><table cellspacing="0" cellpadding="0" class="gsc-completion-container" style="width: 100%;"><tbody><tr class=""><td class="gssb_a " dir="ltr" style="text-align: left;"><div class="gsq_a"><table cellspacing="0" cellpadding="0" style="width: 100%;"><tbody><tr><td style="width: 100%;"><span>t<b>e pa, te ha“</b></span></td></tr></tbody></table></div></td></tr><tr><td class="gssb_a " dir="ltr" style="text-align: left;"><div class="gsq_a"><table cellspacing="0" cellpadding="0" style="width: 100%;"><tbody><tr><td style="width: 100%;"><span>t<b>yrol</b></span></td></tr></tbody></table></div></td></tr><tr><td class="gssb_a " dir="ltr" style="text-align: left;"><div class="gsq_a"><table cellspacing="0" cellpadding="0" style="width: 100%;"><tbody><tr><td style="width: 100%;"><span>first letter you typed if it has a suggested autocomplete

“自动完成建议”表本身具有类。这是我正在使用的当前样式，顶部是这样，以便搜索建议弹出窗口位于标题菜单的正下方。

    .gstl_50 {
    padding:0px !important;}
table.gssb_c {
    top: 50px !important;}

由于它是绝对的，因此它至少在网页顶部有效，目前作为临时解决方案。当我调整table.gssb_c的位置而不是绝对位置时，表消失了。

那么，有没有办法解决这个问题？我当时在想，也许javascript函数可以将输出包装在Div中，但建议弹出表仅这两个类没有ID。但是我还不确定如何编写代码，或者不确定是否有一种样式化表格而不将其包装为相对或粘性的div的方法？
谢谢

如何更改Google自定义搜索自动完成建议弹出窗口的位置？

0 个答案: