用鼠标滚轮控制横向滚动条滚动的几种方法
一直以来，鼠标滚轮能控制页面滚动条的上下滚动及垂直滚动，如果需要对水平滚动条进行滚动呢，必须鼠标按住滚动条拖动，那么如何实现鼠标滚轮控制滚动条水平横向滚动呢，今天揭秘2种方式.
1、用js自带的wheel捕获方法
<!DOCTYPE html>
<html lang="en">
<head>
<style>
body {
padding: 0;
margin: 0;
}
main {
position: relative;
width: 100vw;
height: 100vh;
-webkit-overflow-scrolling: touch;
}
.wrapper {
display: flex;
flex-direction: row;
align-items: flex-start;
flex-wrap: nowrap;
width: auto;
}
.wrapper > div {
pointer-events: none;
flex: 0 0 auto;
width: 100vw;
height: 100vh;
margin: 0;
display: flex;
justify-content: center;
align-items: center;
}
</style>
</head>
<body translate="no">
<main style="overflow: scroll hidden;">
<div class="wrapper">
<div style="background-color:red"></div>
<div style="background-color:blue"></div>
...点击查看剩余70%
{{collectdata}}
网友评论0