首页 > 软件开发 > JQUERY >

jquery监听滚动条事件;jq滚动条事件

来源:互联网 2023-03-16 23:54:01 227

在浏览很多网页中都会发现,当滚动条滚动到一定的位置的时候就出显示一个返回到顶部的小图标,那如何监听判断滚动条滚动到指定的位置后触发某个事件呢?rxB办公区 - 实用经验教程分享!

可以通过使用scroll方法监听滚动条。rxB办公区 - 实用经验教程分享!

如图:rxB办公区 - 实用经验教程分享!

rxB办公区 - 实用经验教程分享!

rxB办公区 - 实用经验教程分享!

jquery监听滚动条事件;jq滚动条事件rxB办公区 - 实用经验教程分享!

方法/步骤

  • 1

    打开html开发工具,新建一个html代码页面,在html代码页面输入大量的文本内容,确保在浏览器上能有滚动条出现。如图:rxB办公区 - 实用经验教程分享!

    jquery监听滚动条事件;jq滚动条事件rxB办公区 - 实用经验教程分享!

  • 2

    在title标签后面创建一个script标签,然后引入jquery文件。如图:rxB办公区 - 实用经验教程分享!

    jquery监听滚动条事件;jq滚动条事件rxB办公区 - 实用经验教程分享!

  • 2该信息未经许可获取自百度经验
  • 3

    新建一个script标签,创建监听滚动条滚动事件(案例中判断当滚动条滚动高度超过100的时候就出现一个弹出框)。如图:rxB办公区 - 实用经验教程分享!

    jquery监听滚动条事件;jq滚动条事件rxB办公区 - 实用经验教程分享!

  • 4

    保存html代码后使用浏览器打开,然后滚动Y轴滚动条,发现滚动到一定位置后会出现一个弹出框表示监听滚动条成功。如图:rxB办公区 - 实用经验教程分享!

    jquery监听滚动条事件;jq滚动条事件rxB办公区 - 实用经验教程分享!

    jquery监听滚动条事件;jq滚动条事件rxB办公区 - 实用经验教程分享!

  • 以上方法由办公区教程网编辑摘抄自百度经验可供大家参考!rxB办公区 - 实用经验教程分享!


    标签: JQUERY

    办公区 Copyright © 2016-2023 www.bgqu.net. Some Rights Reserved. 备案号:湘ICP备2020019561号统计代码