jquery.mousewheel整屏图片上下滚动

2025-10-31 11:35:37

1、准备好需要用到的图标。

jquery.mousewheel整屏图片上下滚动

2、新建html文档。

jquery.mousewheel整屏图片上下滚动

3、书写hmtl代码。

<div class="fixed_r">

<ul>

<li>1</li>

<li>2</li>

<li>3</li>

<li>4</li>

<li>5</li>

<li>6</li>

</ul>

</div>

<div class="num_box">

<div class="num" id="num_0">第1屏</div>

<div class="num" id="num_1">第2屏</div>

<div class="num" id="num_2">第3屏</div>

<div class="num" id="num_3">第4屏</div>

<div class="num" id="num_4">第5屏</div>

<div class="num" id="num_5">第6屏</div>

</div>

<input type="hidden" value="0" class="ddw"/>

<input type="hidden" value="0" class="ddw2"/>

jquery.mousewheel整屏图片上下滚动

4、书写并添加js代码。<script src="js/jquery.mousewheel.js" ></script>

jquery.mousewheel整屏图片上下滚动

5、代码整体结构。

jquery.mousewheel整屏图片上下滚动

6、查看效果。

jquery.mousewheel整屏图片上下滚动

声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢