小编luc*_*r63的帖子

在 Chrome 中，如果 input[list] 和 datalist 放在一个可滚动的容器中，滚动后 datalist 将保持在同一位置，请查看示例：

1. 点击输入，会出现数据列表，
2. Scroll the container,
3. 好奇为什么尽管输入不再可见，但数据列表没有隐藏。

就是这样。Firefox 和其他浏览器可以毫无问题地处理这种情况 - datalist 在滚动时隐藏。

所以，问题是：有没有办法在滚动时隐藏数据列表，即使它位于 Chrome 的嵌套容器中？

更新：这个bug已经提交，两次。等待 Chrome 团队解决！

好像这只是我的话)

有一段时间后执行函数的方法吗？

我正在尝试为我的网站编写一个高级的scrollspy脚本,而我正在考虑的是不是立即执行onScroll操作,而是在一段时间后执行.如果用户快速滚动并且有很多停靠点,我希望scrollspy仅在停止时刷新导航链接,如果用户滚动缓慢(并且可能没有停止),我想要rolllspy每隔0.6秒刷新导航链接.

不幸的是,我不知道从哪里开始.

我正在尝试升级此代码:

var lastId,
    topMenu = jQuery(".a1-nav"),
    topMenuHeight = document.querySelector('header .top-header').offsetHeight;
    menuItems = topMenu.find("a"),
    scrollItems = menuItems.map(function(){
      var item = jQuery(jQuery(this).attr("href"));
      if (item.length) { return item; }
    });

menuItems.click(function(e){
  var href = jQuery(this).attr("href"),
      offsetTop = href === "#" ? 0 : jQuery(href).offset().top-topMenuHeight+1;
  jQuery('html, body').stop().animate({ 
      scrollTop: offsetTop
  }, 300);
  e.preventDefault();
});

jQuery(window).scroll(function(){
   var fromTop = jQuery(this).scrollTop()+topMenuHeight;

   var cur = scrollItems.map(function(){
     if (jQuery(this).offset().top < fromTop)
       return this;
   });

   cur = cur[cur.length-1];
   var id = cur && cur.length ? cur[0].id …

我试图创建一个有点花哨的范围输入）我发现很难为其设置样式，因此我决定最好的方法是为1）风格化<div>和2）透明创建单独的图层<input type="range">

这是示例：
程式化<div有z-index: 2;，<input type="range">有z-index: 5; opacity: 0;
，但无论如何，当我尝试拖动范围的拇指，我实际上只是选择在假拇指文）

这是现场示例

如何解决呢？

更新：这里是在问题解决的例子。

提前抱歉愚蠢的问题 - 我有一个容器和5个内部div.当内部div只有文本内容时,它看起来像这样:
但是,如果我从所有div中删除文本内容并首先添加带有跨度的div,它将如下所示
如果除了第一个(具有混合内容)之外的所有div都有文本内容 - 如下所示:
容器的CSS:

.list {
    display: inline-block;
    font-size: 0;
    height: 100%;
    min-width: 100%;
    overflow: hidden;
    position: relative;
    right: 0;
    white-space: nowrap;
}

内部div的CSS:

.list > div {
    background-image: url();
    background-size: cover;
    box-sizing: padding-box;
    display: inline-block;
    font-size: 15px;
    height: 100%;
    max-height: 752px;
    max-width: 1280px;
    padding: 0.7% 1.3% 0.3%;
}

在这里,您可以查看整个HTML和CSS.

发生了什么,是不是有些textNodes搞砸了？