jquery实现上下滑动选择
$('.rightShow').on('mousewheel', function(ev) {
var dir = ev.originalEvent.wheelDelta
if(dir == 120) {
console.log('向上');
var num = parseInt($(this).find('ul').css('top')); //需要滑动元素的当前top值
var stp = $(this).find('ul li').length - 5; //最大滑动距离
if(Math.abs(num) >= Math.abs(stp * 33)) {
return false
} else {
num -= 33; //滑动的距离
$(this).find('ul').css({
top: num + 'px'
});
};
} else {
var len = parseInt($(this).find('ul').css('top')); //需要滑动元素的当前top值
if(len == 0) {
return false
} else {
var a = len + 33; //滑动的距离
$(this).find('ul').css({
top: a + 'px'
});
}
}
});
jquery实现上下滑动选择的更多相关文章
- Jquery实现特效滑动菜单栏
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 基于 jQuery 实现垂直滑动的手风琴效果
今天我们要与大家分享一个漂亮而灵活的垂直 jQuery 手风琴效果.其主要思想是扩大手风琴片上的点击和显示更多的信息.其他内容片段将变得不那么透明.当使用一个导航箭头导航下一个片段,新的片会从顶部或底 ...
- jQuery选择器的优化选择
jQuery选择器的优化选择 1.1 属性选择器 var $div=$("[id]"); 选中拥有该属性的元素 var $div=$("[id=div]"); ...
- JQuery基础教程:选择元素(中)
自定义选择符 JQuery在各种CSS选择符的基础上还添加了独有的完全不同的自定义选择符,注意,只要可能,jQuery就会使用浏览器原生的DOM选择符引擎去查找元素.但在使用自定义选择符的时候,就无法 ...
- jquery mobile左右滑动切换页面
jquery mobile左右滑动切换页面 $(function() {$("body").bind('swiperight', function() { $.mobile.ch ...
- jQuery 在Table中选择input之类的东西注意事项
jQuery 在Table中选择input之类的东西注意事项: 如果不在td标签中,是不能进行正确选择的: <table id="tblFormId"> <tr& ...
- ul+jquery自定义下拉选择框
<!doctype html> <html> <head> <meta charset="UTF-8"> <title> ...
- Jquery EasyUI Combotree只能选择叶子节点且叶子节点有多选框
Jquery EasyUI Combotree只能选择叶子节点且叶子节点有多选框 Jquery EasyUI Combotree单选框,Jquery EasyUI Combotree只能选择叶子节点 ...
- 基于jQuery鼠标滚轮滑动到页面节点部分
基于jQuery鼠标滚轮滑动到页面节点部分.这是一款基于jQuery+CSS3实现的使用鼠标滚轮或者手势滑动到页面节点部分特效.效果图如下: 在线预览 源码下载 实现的代码. html代码: &l ...
随机推荐
- xamarin Android activity生命周期详解
学Xamarin我为什么要写这样一篇关于Android 的activity生命周期的文章 已经学Xamarin android有一段时间了,现在想起当初Xamarin也走了不少的弯路.当然Xamari ...
- Python函数篇(6)-常用模块及简单的案列
1.模块 函数的优点之一,就是可以使用函数将代码块与主程序分离,通过给函数指定一个描述性的名称,并将函数存储在被称为模块的独立文件中,再将模块导入主程序中,通过import语句允许在当前运行的程序 ...
- yum 命令详解
一. yum 作用: yum 命令是在Fedora 和RedHat 以及SUSE 中基于rpm 的软件包管理器,它可以使系统管理人员交互和自动 ...
- (通用)深度学习环境搭建:tensorflow安装教程及常见错误解决
区别于其他入门教程的"手把手式",本文更强调"因"而非"果".我之所以加上"通用"字样,是因为在你了解了这个开发环境之后 ...
- VOOC还真算是OPPO的核心技术
经常电视看到OPPO打广告说它的VOOC,觉得好奇怪,就一个手机充电讲个不完,尽是骗3.4线城市的人,不过今天研究了一下,还VOOC真算是它的核心技术了. 现在选手机,电池和充电速度是非常重要的,首先 ...
- 【liferay】3、liferay 添加spring支持
1.添加对应的spring的jar 地址:https://spring.io/projects 选中springframework 进入git源码的地方,看简介 我们需要编译好的jar 当然也可以自己 ...
- java sql
import java.sql.Connection;import java.sql.DriverManager;import java.sql.PreparedStatement;import ja ...
- [js高手之路] 跟GhostWu一起封装一个字符串工具库-扩展trim,trimLeft,trimRight方法(2)
我们接着上一篇的继续,在上一篇我们完成了工具库的架构,本文扩展字符串去空格的方法, 一共有3个 1,trimLeft: 去除字符串左边的空格 2,trimRight: 去除字符串右边的空格 3,tri ...
- CS:APP3e 深入理解计算机系统_3e MallocLab实验
详细的题目要求和资源可以到 http://csapp.cs.cmu.edu/3e/labs.html 或者 http://www.cs.cmu.edu/~./213/schedule.html 获取. ...
- HTML5 Audio/Video 标签,属性,方法,事件汇总 (转)
HTML5 Audio/Video 标签,属性,方法,事件 <audio> 标签属性:src:音乐的URLpreload:预加载autoplay:自动播放loop:循环播放contro ...