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 相关文章推荐
javascript 基础篇1 什么是js 建立第一个js程序
Mar 14 Javascript
使用VS开发 Node.js指南
Jan 06 Javascript
js实现键盘Enter键提交表单的方法
May 27 Javascript
在其他地方你学不到的jQuery小贴士和技巧(欢迎收藏)
Jan 20 Javascript
浅谈JavaScript函数的四种存在形态
Jun 08 Javascript
SelecT下拉框选中和取值的解决方法
Nov 22 Javascript
JS组件系列之Gojs组件 前端图形化插件之利器
Nov 29 Javascript
vue todo-list组件发布到npm上的方法
Apr 04 Javascript
解决vue中监听input只能输入数字及英文或者其他情况的问题
Aug 30 Javascript
Vue 如何使用props、emit实现自定义双向绑定的实现
Jun 05 Javascript
JavaScript如何实现监听键盘输入和鼠标监点击
Jul 20 Javascript
详解vue组件之间的通信
Aug 30 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 Google的translate API代码
2008/12/10 PHP
PHP Pear 安装及使用
2009/03/19 PHP
PHP中使用cURL实现Get和Post请求的方法
2013/03/13 PHP
php实现单链表的实例代码
2013/03/22 PHP
浅析PHP页面局部刷新功能的实现小结
2013/06/21 PHP
laravel-admin 中列表筛选方法
2019/10/03 PHP
setInterval 和 setTimeout会产生内存溢出
2008/02/15 Javascript
用javascript getComputedStyle获取和设置style的原理
2008/10/10 Javascript
JS短路原理的应用示例 精简代码的途径
2013/12/13 Javascript
javascript事件委托的方式绑定详解
2015/06/10 Javascript
JavaScript实现的背景自动变色代码
2015/10/17 Javascript
浅析JavaScript访问对象属性和方法及区别
2015/11/16 Javascript
JavaScript如何实现在文本框(密码框)输入提示语
2015/12/25 Javascript
js ajaxfileupload.js上传报错的解决方法
2016/05/05 Javascript
js获取当前年月日-YYYYmmDD格式的实现代码
2016/06/01 Javascript
基于jQuery代码实现圆形菜单展开收缩效果
2017/02/13 Javascript
jQuery事件详解
2017/02/23 Javascript
React Component存在的几种形式详解
2018/11/06 Javascript
基于Three.js实现360度全景图片
2018/12/30 Javascript
详解Vue之计算属性
2020/06/20 Javascript
简单了解前端渐进式框架VUE
2020/07/20 Javascript
vue祖孙组件之间的数据传递案例
2020/12/07 Vue.js
Python 递归函数详解及实例
2016/12/27 Python
Python中Scrapy爬虫图片处理详解
2017/11/29 Python
Django REST framework视图的用法
2019/01/16 Python
Pandas中Series和DataFrame的索引实现
2019/06/27 Python
Python操作MySQL数据库实例详解【安装、连接、增删改查等】
2020/01/17 Python
Python实现初始化不同的变量类型为空值
2020/06/02 Python
MyFrenchPharma中文网:最大的法国药妆平台
2016/10/07 全球购物
美国百年历史早餐食品供应商:Wolferman’s
2017/01/18 全球购物
来自圣地亚哥的实惠太阳镜:Knockaround
2018/08/27 全球购物
班主任工作年限证明
2014/01/12 职场文书
党政领导班子四风问题对照检查材料思想汇报
2014/10/02 职场文书
MySQL中的布尔值,怎么存储false或true
2021/06/04 MySQL
Java虚拟机内存结构及编码实战分享
2022/04/07 Java/Android
Debian11 Xfce终端光标的颜色怎么设置?
2022/08/14 数码科技