scrollLeft滚动(用animate替代)
原:
let checkedLeft1 = $('#dateBox').find('.checked').position().left
let checkedLeft2 = $('#dateBox').find('.checked').offset().left
var dateSpeed = parseInt(checkedLeft1 / 75)
var dateInt = setInterval(function () {
let CLeft = $('#dateBox').find('.checked').offset().left
let CLength = 2325 - checkedLeft1
// if (checkedLeft2 < 0) {
// CLeft = -checkedLeft2
// }
if (CLength <= 375) {
clearInterval(dateInt)
}
if (CLeft === 0) {
clearInterval(dateInt)
} else {
if (checkedLeft2 < 0) {
// $('.datelist-twoBox').scrollLeft(checkedLeft1, '200')
// $('.datelist-twoBox').scrollLeft(75)
$('.datelist-twoBox').animate({'scrollLeft': checkedLeft1}, 1000)
} else {
$('.datelist-twoBox').scrollLeft($('.datelist-twoBox').scrollLeft() + dateSpeed)
}
}
console.log(checkedLeft1)
}, 1)
animate:
let checkedLeft1 = $('#dateBox').find('.checked').position().left
$('.datelist-twoBox').animate({'scrollLeft': checkedLeft1}, 400)
scrollLeft滚动(用animate替代)的更多相关文章
- 完全图解scrollLeft,scrollWidth,clientWidth,offsetWidth 获取相对途径,滚动图片(网上找的,未经试验,但觉得比较好)
获取元素的位置属性可以通过 HTMLElement.offsetLeft HTMLElement.offsetTop 但是,这两个属性所储存的数值并不是该元素相对整个浏览器画布的绝对位置,而是相对于其 ...
- jquery 幻灯片 左右滚动
使用jquery封装的一个幻灯片插件 写的好差 参考了别人写的 后面再重构 现在这个应该可以直接用了 主要实现思路就是 添加当前选中状态 index相对应的 选中的图总是在第一位(也就是加选中状态的 ...
- jquery控制div随滚动条滚动效果
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>jquery div随滚动条 ...
- jquery实现名单滚动
转:http://www.qdfuns.com/notes/25341/917d9cb031f835a086dd445b77b6e04e.html 介绍:记录滚动特效.就是那一排文字不停地滚啊滚啊滚得 ...
- .net asp [转载]ASP:循环滚动图片的代码+解释
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jQuery控制页面滚动条上下滚动
.向上滚动 $(); .向下滚动 $(); 参数解读:$(this)表示要实现上下滚动的对象,-50表示向上滚动50px , +50表示向下滚动50px ,1000表示滚动速度
- Index
我主要在研究.NET/C# 实现 PC IMERP 和 Android IMERP ,目的在解决企业通信中遇到的各类自动化问题 分布式缓存框架: Microsoft Velocity:微软自家分布 ...
- GitHub上整理的一些工具
技术站点 Hacker News:非常棒的针对编程的链接聚合网站 Programming reddit:同上 MSDN:微软相关的官方技术集中地,主要是文档类 infoq:企业级应用,关注软件开发领域 ...
- GitHub上整理的一些工具[转载]
Source:http://segmentfault.com/q/1010000002404545 技术站点 Hacker News:非常棒的针对编程的链接聚合网站 Programming reddi ...
随机推荐
- 开发框架:IOE 架构
ylbtech-开发框架:IOE 架构 传统的IOE架构(IBM小型机.EMC存储设备.Oracle数据库). 1.返回顶部 2.返回顶部 3.返回顶部 4.返回顶部 5.返回顶部 ...
- 9-16Jenkins-4节点
1.Jenkins-系统管理-全局安全配置,设置代理端口和协议类型,保存 2.Jenkins-系统管理-节点管理,建立节点 设置节点名称,节点工作目录.标签.用法.启动方式设置如下: 标签用于管理节点 ...
- Shell 定时发送邮件检查网站脚本/邮件正文
#!/bin/bash ############################################################## # File Name: check_http.s ...
- 1109 Group Photo (25 分)
1109 Group Photo (25 分) Formation is very important when taking a group photo. Given the rules of fo ...
- 最简单的TCP、UDP案例及各函数的详细解释
TCP: server #include "stdafx.h" #include<iostream> #define BUF_SZIE 64 #include &quo ...
- 使用promise对象封装一个ajaxGet函数
function promiseAjax(url,data){ var pro = new Promise(function(success,failed){ 承诺一 ...
- Data Provider 中没有.net framework Data provider for Mysql 的解决方法
近来做的一个项目中,数据库用的是 MySql, 而在项目使用 Entity Data Model 来做数据服务层,可是在项目中添加 Data Entty Model 时,一般我们都会选择从数据库中直接 ...
- 知识picture
- 31. Studio获取新的ID值方法
var fun = ABS_LOADBEAN("com.plug.FunctionHelper");var vid1 = fun.utilHelper.getNextID(&quo ...
- 模拟Vue之数据驱动1
一.前言 Vue有一核心就是数据驱动(Data Driven),允许我们采用简洁的模板语法来声明式的将数据渲染进DOM,且数据与DOM是绑定在一起的,这样当我们改变Vue实例的数据时,对应的DOM元素 ...