【问题标题】:Kendo UI dropdownlist mobile scrollingKendo UI 下拉列表移动滚动
【发布时间】:2014-05-22 05:14:18
【问题描述】:

我目前正在使用 Kendo UI 开发应用程序。我使用这样的下拉列表

Kendo UI dropdownlist

在浏览器上它工作正常。我可以使用鼠标滚轮打开列表滚动,但是当我尝试在具有触摸功能的设备(平板电脑或智能手机)上使用它时,我无法在下拉列表中滚动。

如何在下拉列表中添加侦听器或其他内容,以便滚动?

【问题讨论】:

    标签: javascript html kendo-ui telerik kendo-mobile


    【解决方案1】:

    从这里开始:

    Kendo Support Forum - Unable to scroll on iPad

    要启用 DropDownList 的滚动(特别是弹出窗口),您 需要包含 kendo.mobile.core.js、kendo.mobile.scroller.js。查看 this jsFiddle demo,显示如何在移动设备中启用滚动 设备。

    小提琴的css:

    .km-touch-scrollbar {
      position: absolute;
      visibility: hidden;
      z-index: 200000;
      height: .3em;
      width: .3em;
      background-color: #333;
      opacity: 0;
      border-radius: 0.4em;
      -moz-border-radius: 0.4em;
      -webkit-border-radius: 0.4em;
      -webkit-transform-origin: 0 0;
      -moz-transform-origin: 0 0;
      transform-origin: 0 0;
      -webkit-transition: opacity 0.3s linear;
      -moz-transition: opacity 0.3s linear;
      transition: opacity 0.3s linear;
    }
    .km-vertical-scrollbar {
      height: 100%;
      right: 1px;
      top: 0;
    }
    .km-horizontal-scrollbar {
      width: 100%;
      left: 0;
      bottom: 1px;
    }
    .km-scroll-container {
      -moz-user-select: none;
      -webkit-user-select: none;
      user-select: none;
      -webkit-margin-collapse: separate;
    }
    .km-android .km-touch-scrollbar {
      background-color: #33b5e5;
      border-radius: 0;
      -moz-border-radius: 0;
      -webkit-border-radius: 0;
    }
    

    【讨论】:

    • 这项工作,但这不是移动下拉列表。这是网络下拉列表。在这里您可以看到移动和网络下拉列表:example
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-09-27
    • 1970-01-01
    • 2017-08-01
    相关资源
    最近更新 更多