jQuery实现鼠标滚轮动态改变样式或效果


Posted in Javascript onJanuary 05, 2015

代码如下:

$(window).scroll(function() { 

            var scrolls = $(this).scrollTop();

            $(".context_block").each(function(){ //类名为“context_block”的块级元素

                var height = $(this).height();

                if($(this).position().top + height-60> scrolls){

                    var _index = $(".context_block").index($(this));

                    $(".menu  a").parent().siblings().contents("a").removeClass("hover_mobileLink");    

                    $($(".menu  a")[_index]).addClass("hover_mobileLink");//动态改变class为“menu” 的块级元素下的a标签的样式(添加或者删除某个类)

                    return false;

                }

            });

        });

核心代码很简单,实现的效果却非常不错,这里推荐给小伙伴们。

Javascript 相关文章推荐
document.body.scrollTop 值总为0的解决方法 比较常见的标准问题
Nov 30 Javascript
使用js实现按钮控制文本框加1减1应用于小时+分钟
Dec 09 Javascript
JS中判断null、undefined与NaN的方法
Mar 26 Javascript
javascript数组去重的方法汇总
Apr 14 Javascript
javascript实现设置、获取和删除Cookie的方法
Jun 01 Javascript
jQuery常用且重要方法汇总
Jul 13 Javascript
jquery实现LED广告牌旋转系统图片切换效果代码分享
Aug 26 Javascript
js多功能分页组件layPage使用方法详解
May 19 Javascript
Express URL跳转(重定向)的实现方法
Apr 07 Javascript
解决jquery的ajax调取后端数据成功却渲染失败的问题
Aug 08 jQuery
详解html-webpack-plugin插件(用法总结)
Sep 12 Javascript
原生js实现密码强度验证功能
Mar 18 Javascript
jquery.cookie.js使用指南
Jan 05 #Javascript
在Google 地图上实现做的标记相连接
Jan 05 #Javascript
js获取时间并实现字符串和时间戳之间的转换
Jan 05 #Javascript
jQuery中attr()方法用法实例
Jan 05 #Javascript
jQuery实现自定义下拉列表
Jan 05 #Javascript
使用javascript实现监控视频播放并打印日志
Jan 05 #Javascript
jQuery圆形统计图开发实例
Jan 04 #Javascript
You might like
用php和MySql来与ODBC数据连接
2006/10/09 PHP
phpmyadmin安装时提示:Warning: require_once(./libraries/common.inc.php)错误解决办法
2011/08/18 PHP
PHP判断远程图片是否存在的几种方法
2014/05/04 PHP
PHP获取QQ达人QQ信息的方法
2015/03/05 PHP
php判断当前操作系统类型
2015/10/28 PHP
php实现的后台表格分页功能示例
2017/10/23 PHP
jquery 插件开发方法小结
2009/10/23 Javascript
ExtJS自定义主题(theme)样式详解
2013/11/18 Javascript
js购物车实现思路及代码(个人感觉不错)
2013/12/23 Javascript
jquery ajax 如何向jsp提交表单数据
2015/08/23 Javascript
vue实现动态数据绑定
2017/04/28 Javascript
angularjs+bootstrap实现自定义分页的实例代码
2017/06/19 Javascript
解决layui前端框架 form表单,table表等内置控件不显示的问题
2018/08/19 Javascript
JavaScript常用工具方法封装
2019/02/12 Javascript
利用Promise自定义一个GET请求的函数示例代码
2019/03/20 Javascript
vue 动态添加的路由页面刷新时失效的原因及解决方案
2021/02/26 Vue.js
[02:19]DOTA2女子战队FOX视频专访:希望更多美眉一起加入
2013/10/15 DOTA
Python实现批量将word转html并将html内容发布至网站的方法
2015/07/14 Python
python基于pygame实现响应游戏中事件的方法(附源码)
2015/11/11 Python
python3+PyQt5使用数据库表视图
2018/04/24 Python
python线程池threadpool实现篇
2018/04/27 Python
Python实现压缩文件夹与解压缩zip文件的方法
2018/09/01 Python
python re正则匹配网页中图片url地址的方法
2018/12/20 Python
PyCharm License Activation激活码失效问题的解决方法(图文详解)
2020/03/12 Python
Python中Selenium模块的使用详解
2020/10/09 Python
Python实现简单的猜单词小游戏
2020/10/28 Python
分享一枚pycharm激活码适用所有pycharm版本我的pycharm2020.2.3激活成功
2020/11/20 Python
澳大利亚Rockwear官网:女子瑜伽、健身和运动服
2021/01/26 全球购物
七年级历史教学反思
2014/02/05 职场文书
大学生个人自荐信
2014/02/24 职场文书
安全生产管理合理化建议书
2014/03/12 职场文书
初中学校军训方案
2014/05/09 职场文书
2016年学校综治宣传月活动总结
2016/03/16 职场文书
为什么MySQL 删除表数据 磁盘空间还一直被占用
2021/10/16 MySQL
apache虚拟主机配置的三种方式(小结)
2022/07/23 Servers
使用Cargo工具高效创建Rust项目
2022/08/14 Javascript