diff --git a/src/components/homesections/homesections.js b/src/components/homesections/homesections.js
index 87be8c7c33..430c06bc57 100644
--- a/src/components/homesections/homesections.js
+++ b/src/components/homesections/homesections.js
@@ -290,7 +290,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
         html += '</div>';
 
         if (enableScrollX()) {
-            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">';
+            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">';
             html += '<div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x">';
         } else {
             html += '<div is="emby-itemscontainer" class="itemsContainer focuscontainer-x padded-left padded-right vertical-wrap">';
@@ -343,7 +343,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
         if (userViews.length) {
             html += '<h2 class="sectionTitle sectionTitle-cards padded-left">' + globalize.translate('HeaderMyMedia') + '</h2>';
             if (enableScrollX()) {
-                html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">';
+                html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">';
                 html += '<div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x">';
             } else {
                 html += '<div is="emby-itemscontainer" class="itemsContainer padded-left padded-right focuscontainer-x vertical-wrap">';
@@ -423,7 +423,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
 
         html += '<h2 class="sectionTitle sectionTitle-cards padded-left">' + globalize.translate('HeaderContinueWatching') + '</h2>';
         if (enableScrollX()) {
-            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">';
+            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">';
             html += '<div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x" data-monitor="videoplayback,markplayed">';
         } else {
             html += '<div is="emby-itemscontainer" class="itemsContainer padded-left padded-right vertical-wrap focuscontainer-x" data-monitor="videoplayback,markplayed">';
@@ -496,7 +496,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
 
         html += '<h2 class="sectionTitle sectionTitle-cards padded-left">' + globalize.translate('HeaderContinueWatching') + '</h2>';
         if (enableScrollX()) {
-            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">';
+            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">';
             html += '<div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x" data-monitor="audioplayback,markplayed">';
         } else {
             html += '<div is="emby-itemscontainer" class="itemsContainer padded-left padded-right vertical-wrap focuscontainer-x" data-monitor="audioplayback,markplayed">';
@@ -582,7 +582,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
                 html += '</div>';
 
                 if (enableScrollX()) {
-                    html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true" data-scrollbuttons="false">';
+                    html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true" data-scrollbuttons="false">';
                     html += '<div class="padded-top padded-bottom scrollSlider focuscontainer-x">';
                 } else {
                     html += '<div class="padded-top padded-bottom focuscontainer-x">';
@@ -639,7 +639,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
                 html += '</div>';
 
                 if (enableScrollX()) {
-                    html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">';
+                    html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">';
                     html += '<div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x">'
                 } else {
                     html += '<div is="emby-itemscontainer" class="itemsContainer padded-left padded-right vertical-wrap focuscontainer-x">';
@@ -713,7 +713,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
         html += '</div>';
 
         if (enableScrollX()) {
-            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">';
+            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">';
             html += '<div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x" data-monitor="videoplayback,markplayed">'
         } else {
             html += '<div is="emby-itemscontainer" class="itemsContainer padded-left padded-right vertical-wrap focuscontainer-x" data-monitor="videoplayback,markplayed">';
@@ -785,7 +785,7 @@ define(['connectionManager', 'cardBuilder', 'appSettings', 'dom', 'apphost', 'la
         html += '</div>';
 
         if (enableScrollX()) {
-            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">';
+            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">';
             html += '<div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x">'
         } else {
             html += '<div is="emby-itemscontainer" class="itemsContainer padded-left padded-right vertical-wrap focuscontainer-x">';
diff --git a/src/components/scroller.js b/src/components/scroller.js
index e3f9a956d8..c3c64a403e 100644
--- a/src/components/scroller.js
+++ b/src/components/scroller.js
@@ -575,7 +575,9 @@ define(['browser', 'layoutManager', 'dom', 'focusManager', 'ResizeObserver', 'sc
 		 */
         function normalizeWheelDelta(event) {
             // wheelDelta needed only for IE8-
-            scrolling.curDelta = ((o.horizontal ? event.deltaY || event.deltaX : event.deltaY) || -event.wheelDelta);
+            // JELLYFIN MOD: Only use deltaX for horizontal scroll instead of `event.deltaY || event.deltaX`
+            scrolling.curDelta = ((o.horizontal ? event.deltaX : event.deltaY) || -event.wheelDelta);
+            // END JELLYFIN MOD
 
             if (transform) {
                 scrolling.curDelta /= event.deltaMode === 1 ? 3 : 100;
diff --git a/src/components/search/searchresults.template.html b/src/components/search/searchresults.template.html
index 33c9389190..1deecaca6c 100644
--- a/src/components/search/searchresults.template.html
+++ b/src/components/search/searchresults.template.html
@@ -11,7 +11,7 @@
 <div class="hide verticalSection movieResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Movies}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -19,7 +19,7 @@
 <div class="hide verticalSection seriesResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Shows}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -27,7 +27,7 @@
 <div class="hide verticalSection episodeResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Episodes}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -35,7 +35,7 @@
 <div class="hide verticalSection sportsResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Sports}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -43,7 +43,7 @@
 <div class="hide verticalSection kidsResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Kids}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -51,7 +51,7 @@
 <div class="hide verticalSection newsResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${News}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -59,7 +59,7 @@
 <div class="hide verticalSection programResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Programs}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -67,7 +67,7 @@
 <div class="hide verticalSection videoResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Videos}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -75,7 +75,7 @@
 <div class="hide verticalSection playlistResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Playlists}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -83,7 +83,7 @@
 <div class="hide verticalSection artistResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Artists}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -91,7 +91,7 @@
 <div class="hide verticalSection albumResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Albums}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -99,7 +99,7 @@
 <div class="hide verticalSection songResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Songs}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -107,7 +107,7 @@
 <div class="hide verticalSection photoAlbumResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${HeaderPhotoAlbums}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -115,7 +115,7 @@
 <div class="hide verticalSection photoResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Photos}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -123,7 +123,7 @@
 <div class="hide verticalSection audioBookResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${HeaderAudioBooks}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -131,7 +131,7 @@
 <div class="hide verticalSection bookResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${Books}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
@@ -139,7 +139,7 @@
 <div class="hide verticalSection peopleResults">
     <h2 class="sectionTitle sectionTitle-cards focuscontainer-x padded-left padded-right">${People}</h2>
 
-    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" data-mousewheel="false" class="padded-top-focusscale padded-bottom-focusscale">
+    <div is="emby-scroller" data-horizontal="true" data-centerfocus="card" class="padded-top-focusscale padded-bottom-focusscale">
         <div is="emby-itemscontainer" class="focuscontainer-x itemsContainer scrollSlider"></div>
     </div>
 </div>
diff --git a/src/controllers/favorites.js b/src/controllers/favorites.js
index a4f2af64dd..c06b0bd8fb 100644
--- a/src/controllers/favorites.js
+++ b/src/controllers/favorites.js
@@ -253,7 +253,7 @@ define(["appRouter", "cardBuilder", "dom", "globalize", "connectionManager", "ap
             }
 
             html += "</div>";
-            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true"><div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x" data-monitor="markfavorite"></div></div>';
+            html += '<div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true"><div is="emby-itemscontainer" class="itemsContainer scrollSlider focuscontainer-x" data-monitor="markfavorite"></div></div>';
             html += "</div>";
         }
 
diff --git a/src/itemdetails.html b/src/itemdetails.html
index 100e3f968a..ba36eb85b8 100644
--- a/src/itemdetails.html
+++ b/src/itemdetails.html
@@ -182,21 +182,21 @@
 
                 <div class="verticalSection itemVerticalSection moreFromSeasonSection hide">
                     <h2 class="sectionTitle sectionTitle-cards padded-left padded-right"></h2>
-                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">
+                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">
                         <div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer"></div>
                     </div>
                 </div>
 
                 <div class="verticalSection itemVerticalSection moreFromArtistSection hide">
                     <h2 class="sectionTitle sectionTitle-cards padded-left padded-right"></h2>
-                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">
+                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">
                         <div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer"></div>
                     </div>
                 </div>
 
                 <div id="castCollapsible" class="verticalSection detailVerticalSection hide">
                     <h2 id="peopleHeader" class="sectionTitle sectionTitle-cards padded-left padded-right">${HeaderCastCrew}</h2>
-                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">
+                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">
                         <div id="castContent" is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer"></div>
                     </div>
                 </div>
@@ -218,14 +218,14 @@
 
                 <div id="scenesCollapsible" class="verticalSection itemVerticalSection verticalSection-extrabottompadding hide">
                     <h2 class="sectionTitle sectionTitle-cards padded-left padded-right">${HeaderScenes}</h2>
-                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">
+                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">
                         <div id="scenesContent" is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer"></div>
                     </div>
                 </div>
 
                 <div id="similarCollapsible" class="verticalSection itemVerticalSection verticalSection-extrabottompadding hide">
                     <h2 class="sectionTitle sectionTitle-cards padded-left padded-right">${HeaderMoreLikeThis}</h2>
-                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-mousewheel="false" data-centerfocus="true">
+                    <div is="emby-scroller" class="padded-top-focusscale padded-bottom-focusscale" data-centerfocus="true">
                         <div is="emby-itemscontainer" class="scrollSlider focuscontainer-x itemsContainer similarContent"></div>
                     </div>
                 </div>
diff --git a/src/selectserver.html b/src/selectserver.html
index dd52467bfe..2c84525174 100644
--- a/src/selectserver.html
+++ b/src/selectserver.html
@@ -3,7 +3,7 @@
         <div class="padded-left padded-right flex align-items-center justify-content-center" style="margin-bottom:2em;">
             <h1 class="sectionTitle sectionTitle-cards">${HeaderSelectServer}</h1>
         </div>
-        <div class="padded-top padded-bottom-focusscale flex-grow flex" data-mousewheel="false" data-horizontal="true" data-centerfocus="card">
+        <div class="padded-top padded-bottom-focusscale flex-grow flex" data-horizontal="true" data-centerfocus="card">
             <div is="emby-itemscontainer" class="scrollSlider focuscontainer-x padded-left padded-right servers flex-grow" style="display: block; text-align: center;" data-hovermenu="false" data-multiselect="false"></div>
         </div>
     </div>