c# - 在 asp.net web 应用程序的 Gridview 中使用 shift + 滚动的水平滚动？

Question

我在 asp.net 中有一个 web 应用程序，它有一个超过 12 列的 gridview。我使用

添加了一个水平滚动条

 <div style="overflow-x: auto;">
  <asp:GridView ID="gvBill" runat="server" >
  .
  .
  </asp:GridView>

我需要水平滚动的功能.. 只是 gridview。我搜索并找到了有关 mouseWheel 事件的答案，但它们都是针对 c# Windows 应用程序的。 我需要和 StackOverflow 中一样的东西。请给我一些网址或任何可以提供帮助的东西。谢谢。

例如:在 SO 中，当我们按住 Shift 键并使用鼠标滚动/触摸板滚动时，它会水平滚动。在这里试试:SQLBulkCopy inserts a new row with NULL values for all columns

Answer 1

.Gridview{
    overflow-x: scroll;
}

和

<asp:GridView ID="gvBill" runat="server" CssClass="Gridview" />.

将向x方向添加滚动

相反，如果你想捕捉鼠标滚轮事件，我找到了这个解决方案:

(function() {
    function scrollHorizontally(e) {
        e = window.event || e;
        var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));
        document.getElementById('yourDiv').scrollLeft -= (delta*40); // Multiplied by 40
        e.preventDefault();
    }
    if (document.getElementById('yourDiv').addEventListener) {
        // IE9, Chrome, Safari, Opera
        document.getElementById('yourDiv').addEventListener("mousewheel", scrollHorizontally, false);
        // Firefox
        document.getElementById('yourDiv').addEventListener("DOMMouseScroll", scrollHorizontally, false);
    } else {
        // IE 6/7/8
        document.getElementById('yourDiv').attachEvent("onmousewheel", scrollHorizontally);
    }
})();

基本上，当它加载文档时，它会获取您的元素的 id，并将监听器添加到 scrollHorizo​​ntally...测试它，如果它有帮助，请告诉我

来源:Horizontal scrolling with mouse wheel in a div

我提供了一个 jsfiddle https://jsfiddle.net/Lugj8dp2/ 它似乎适用于普通表，它应该适用于您的情况。