jQuery操作滚动条
一、窗体滚动条
1、获取窗体滚动条当前纵向和横向位置
var currentY=$(document.body).scrollTop();//窗体滚动条纵向位置
var currentX=$(document.body).scrollLeft();//窗体滚动条横向位置
2、设置窗体滚动条到指定位置
var Y=想滚动到的垂直位置;
var X=想滚动到的水平位置;
$(window).scrollTop(Y);
$(window).scrollLeft(X);
二、元素内滚动条;比如操作页面内一id为dataDiv的div标签
1、获取div元素内滚动条位置
var currentY=$('#dataDiv').scrollTop();//div内滚动条纵向位置
var currentX=$('#dataDiv').scrollLeft();//div内滚动条横向位置
2、设置div内滚动条到指定位置
var Y=想滚动到的垂直位置;
var X=想滚动到的水平位置;
$('#dataDiv').scrollTop(Y);
$('#dataDiv').scrollLeft(X);
三、其他位置值
1、当前window可视内容区域高宽
window.innerHeight;//高
window.innerWidth;//宽
2、元素高宽以及相对于文档偏移量
$('#dataDiv').height();//元素高
$('#dataDiv').width();//元素宽
$('#dataDiv').offset().top;//元素相对文档顶部偏移量
$('#dataDiv').offset().left;//元素相对文档左边偏移量
jQuery操作滚动条的更多相关文章
- jquery操作滚动条滚动到指定位置
<html><head><script type="text/javascript" src="/jquery/jquery.js" ...
- jquery操作滚动条滚动到指定元素位置 scrollTop
$('.brand_t a').bind('click',function(){ if($(this).attr('title1')){ var toChar = $(this).attr('titl ...
- 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式
本系列文章导航 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式 一.摘要 本篇文章讲解如何使用jQuery获取和操作元素的属性和CSS样式. 其中DOM属性和元素属性的区分值得 ...
- jQuery入门(2)使用jQuery操作元素的属性与样式
jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...
- jQuery操作Dom、jQuery事件机制、jQuery补充部分
jQuery操作Dom: 修改属性: //使用attr()方法 //attr(name, value) //name:要修改的属性的属性名 //value:对应的值 //attr方法,如果当前标签有要 ...
- jQuery自定义滚动条样式插件mCustomScrollbar
如果你构建一个很有特色和创意的网页,那么肯定希望定义网页中的滚动条样式,这方面的 jQuery 插件比较不错的,有两个:jScrollPane 和 mCustomScrollbar. 关于 jScro ...
- 使用jQuery操作元素的属性与样式
本文学习如何使用jQuery获取和操作元素的属性和CSS样式. 元素属性和Dom属性 对于下面这样一个标签元素: <img id='img' src="1.jpg" alt= ...
- 第四章 使用jQuery操作DOM
第四章 使用jQuery操作DOM 一.DOM操作 在jQuery中的DOM操作主要可分为样式操作.文本和value属性值操作.节点操作: 节点操作又包含属性操作.节点遍历和CSS-DOM操作. 其中 ...
- jquery操作iframe的方法:父页面和子页面相互操作的方法
今天在弄jquery操作iframe中元素:先由iframe中的子页面b.html给外面的父页面a.html页面传值,再将a.html页面计算机的值放到b.html页面上,这里就用到子页面和父页面相互 ...
随机推荐
- git详细教程
Table of Contents 1 Git详细教程 1.1 Git简介 1.1.1 Git是何方神圣? 1.1.2 重要的术语 1.1.3 索引 1.2 Git安装 1.3 Git配置 1.3.1 ...
- The Skyline Problem
A city's skyline is the outer contour of the silhouette formed by all the buildings in that city whe ...
- Boost_udp错误
注意一点:当我们不同PC机间进行通信的时候,IP和端口号是不一样的.之前遇到的问题是,boost_system_error,这是因为我们在写程序的时候,发送和接收绑定了同一个端口,导致程序出错. ...
- H5实现拍照并上传
<!DOCTYPE HTML><html><head> <meta charset="UTF-8"> <meta ...
- Struts2 面试题分析
1. 简述 Struts2 的工作流程: ①. 请求发送给 StrutsPrepareAndExecuteFilter ②. StrutsPrepareAndExecuteFilter 判定该请求是否 ...
- iOS开发的设计模式
ios开发学习中,经常弄不清楚ios的开发模式,今天我们就来进行简单的总结和探讨~ (一)代理模式 应用场景:当一个类的某些功能需要由别的类来实现,但是又不确定具体会是哪个类实现. 优势:解耦合 敏捷 ...
- 20145208 实验二 Java面向对象程序设计
20145208 实验二 Java面向对象程序设计 实验内容 初步掌握单元测试和TDD 理解并掌握面向对象三要素:封装.继承.多态 初步掌握UML建模 熟悉S.O.L.I.D原则 了解设计模式 实验步 ...
- HoloLens开发手记 - Unity之Gestures手势识别
手势识别是HoloLens交互的重要输入方法之一.HoloLens提供了底层API和高层API,可以满足不同的手势定制需求.底层API能够获取手的位置和速度信息,高层API则借助手势识别器来识别预设的 ...
- dp和px转换
在编写自定义view的时候,通常会在onTouchEvent回调方法中进行一些关乎距离的判断逻辑,这里的距离常量如果适配到多分辨率的不同设备上时可能会出现一些错乱的问题. 所以一般来说,常常需要dp到 ...
- RVM 解决 Ruby 的版本问题
RVM 是一个命令行工具,可以提供一个便捷的多版本 Ruby 环境的管理和切换. RVM 的官网是 https://rvm.io/. 如果你打算学习 Ruby / Rails, RVM 是必不可少的工 ...