制作可以鼠标滑动的轮播图，支持移动端（利用Bootstrap5布置其样式）

最近一直在研究Bootstrap5的前端开发，看bootstrap例子的时候发现了一个好的模型，所以就手痒给自己写了一个

PC端

移动端

先简单的介绍一些吧，支持移动端和PC端的拖动且由最后一张图切到第一张图的时候是平滑过渡，不会在掉头过渡

OK，下面那直接放代码，切记如果要直接用的话注意要在头部加一个Bootstrap5的CSS代码引入

<div class="slider">
				<div class="slider-indicators">
					<button class="active" data-to="0" tabindex="-1"></button>
					<button data-to="1" tabindex="-1"></button>
					<button data-to="2" tabindex="-1"></button>
				</div>
				<div class="slider-outer">
					<div class="slider-inner">
						<div class="slider-item">
							<a href="">
								<img src="https://around.createx.studio/img/demo/food-blog/videos/03.jpg" loading="lazy">
								<span>Gallery video caption</span>
							</a>
						</div>
						<div class="slider-item">
							<a href="">
								<img src="https://around.createx.studio/img/demo/food-blog/videos/01.jpg" loading="lazy">
								<span>Gallery video caption</span>
							</a>
						</div>
						<div class="slider-item">