Question

因此我正在此页面https://www.pacificotest.com.pe/中工作。
-当有人滚动页面时，键入“ Clinica”时出现的框
移动不是绝对的，当我将其更改为绝对时，它仍然会继续移动。
-是否有将两个Class或ID统一在一起的css，js或jquery代码，这样他们就不会彼此远离？

When you scroll down a little bit

When you scroll top fast

所以我创建的脚本就是这个：

   $thead = $dom_ods->createElement("thead", "");
   $ods2_tmp->insertBefore($thead, $ods2_tmp->firstChild);
   $dom_ods->saveHTML();

CSS：

<script>
            $(window).scroll(function () {
                if ($(window).scrollTop() >= 1) {
                    $('.autocomplete-suggestions').each(function(i,j) {
                        $(this).addClass('fix-searcher'+(i+1));
                    });
                }
            });

            $(window).scroll(function () {
                if ($(window).scrollTop() >= 15) {
                    $('.aui .fix-searcher1').addClass("fixed");
                    $('.aui .fix-searcher1').removeClass("fix-searcher1");
                    $('.aui .fix-searcher2').addClass("fixed2");
                    $('.aui .fix-searcher2').removeClass("fix-searcher2");  
                } else {
                    $('.aui .fix-searcher1').removeClass("fixed");
                    $('.aui .fix-searcher1').addClass("fix-searcher1");
                    $('.aui .fix-searcher2').removeClass("fixed2");
                    $('.aui .fix-searcher2').addClass("fix-searcher2");
                }
            });
        </script>

Answer 1

新方法

试试看。使用CSS定位正文内容，然后只需将静态类分配给建议div。

public class MyTimePicker extends TimePicker {
    public MyTimePicker(Context context) {
        super(context);
    }

    //This is the important constructor
    public MyTimePicker(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public MyTimePicker(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    public MyTimePicker(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        super(context, attrs, defStyleAttr, defStyleRes);
    }

    @Override
    public boolean onInterceptTouchEvent(MotionEvent ev)
    {
        if (ev.getActionMasked() == MotionEvent.ACTION_DOWN) {
        //Excluding the top of the view
            if(ev.getY() < getHeight()/3.3F)
                return false;

            ViewParent p = getParent();
            if (p != null)
                p.requestDisallowInterceptTouchEvent(true);
        }

        return false;
    }
}

// here simply assign a static class and we won't be doing any
// listening on window scroll any longer instead we will use
// css to re-position our content.
$(function() {
  $('.autocomplete-suggestions').each(function(index) {
    $(this).addClass('fix-searcher' + (index + 1));
  });
});

旧答案

由于从页面添加和删除顶部深蓝色横幅的方式，似乎导致下拉列表的对齐。 site snapshot with top banner

您要进行的更改类的scrollTop检查应等于该横幅的高度。我也将使用不同的类名来添加标识符以搜索div，这样样式和div标识可以保持独立。像这样：

.au .affix-top + #content {
  margin-top: auto;
}

/* here in the browser 60px worked fine for me, you can play around with the number */
.au .affix + #content {
  margin-top: 60px;
}

/* no need for other .fixed and .fixed2 classes */
.fix-searcher1 {
  top: 140px !important;
  z-index: 100 !important;
}

.fix-searcher2 {
  top: 490px !important;
  z-index: 100 !important;
}

我希望这会有所帮助。

框与搜索栏分开

1 个答案:

新方法

旧答案