JQuery控制滚动条滚动到指定位置
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.redMark{
color: red;
font-weight: bold;
}
.blueMark{
color: blue;
font-weight: bold;
}
</style>
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<script>
function scrollToError() {
var body = $('html,body');
var scroll_1 = $('.try').first();
var scroll_2 = $('#test');
if(scrollTo.length) {
body.animate({scrollTop:scroll_1.offset().top - 100 }, 2000);
body.animate({scrollTop:scroll_2.offset().top - 100 }, 2000);
}
}
</script>
</head>
<body>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p class='try redMark'>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p id='test' class='blueMark'>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p class='try redMark'>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<input type="submit" onclick="scrollToError()" value="Scroll Action"/>
</body>
</html>
更多参考:http://www.cnblogs.com/yichengbo/archive/2011/10/24/2222638.html
JQuery控制滚动条滚动到指定位置的更多相关文章
- jquery操作滚动条滚动到指定位置
<html><head><script type="text/javascript" src="/jquery/jquery.js" ...
- Vue如何引入jquery实现平滑滚动到指定位置效果
在以往的做法里首选jquery的animate实现,但是Vue里并没有这个方法.如何在Vue项目中实现点击导航平滑滚动到指定位置,为了这效果我是快要崩溃了,上网查阅了很久发现并没有真正意义上解决这个问 ...
- DIV滚动条滚动到指定位置(jquery的position()与offset()方法区别小记)
相对浏览器,将指定div滚到到指定位置,其用法如下 $("html,body").animate({scrollTop: $(obj).offset().top},speed); ...
- jQuery实现将div中滚动条滚动到指定位置的方法
1.JS代码: onload = function () { //初始化 scrollToLocation(); }; function scrollToLocation() { var mainCo ...
- DIV内滚动条滚动到指定位置
相对浏览器,将指定div滚到到指定位置,其用法如下: $("html,body").animate({scrollTop: $(obj).offset().top},speed); ...
- 控制webbrowser滚动到指定位置
在构造函数中添加事件: webBrowser.DocumentCompleted+=new WebBrowserDocumentCompletedEventHandler(webBrowser_Doc ...
- jquery操作滚动条滚动到指定元素位置 scrollTop
$('.brand_t a').bind('click',function(){ if($(this).attr('title1')){ var toChar = $(this).attr('titl ...
- js将滚动条滚动到指定位置的方法
代码如下(主要是通过设置Location的hash属性): <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN& ...
- 利用jquery制作滚动到指定位置触发动画
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>利用 ...
随机推荐
- POI导出excel日期格式
参考帖子: [1]http://www.ithao123.cn/content-2028409.html [2]http://javacrazyer.iteye.com/blog/894850 再读本 ...
- vmware esxi 找不到网卡驱动,硬盘的解决方法
解决方法就是把ESXi无法识别的硬件的驱动定制进安装镜像文件中. ESXi 5.5 U2: VMware-VMvisor-Installer-5.5.0.update02-2068190.x86_64 ...
- css3部分选择器整理
整理些选择器,加深印象和理解 标签选择器 body{} 表示body标签 类选择器 .className{} 表示类名class为className的所有标签 id选择器 #idName{} 表示id ...
- NSString相关操作
//创建一个字符串对象 NSString * str_1 = @"Hello"; //字面量方法 ; NSString * str_2 = [NSString stringWith ...
- MAC 远程桌面链接 证书或链接无效
RDC --> 首选项 --> 安全性 --> 勾选即使验证失败也要链接. 问题解决.
- javaWeb开发中的中文编码问题
常规解决乱码问题的方法是: a.把所有的jsp页面的charset设置为UTF-8. b.添加过滤器,在filter内调用request.setCharacterEncoding("ut ...
- ios build时,Undefined symbols for architecture xxx问题的总结
简单来说,Undefined symbols基本上等于JAVA的ClassNotFoundException,最常见的原因有这几种: build的时候没有加framework 比如说,有一段代码我用了 ...
- “ifstream” 未声明的标识符
#include <fstream> 还要加入: using namespace std;
- Unity VR全景漫游
一.前言: 最近VR如火如茶,再不学习就落伍啦.有空闲时间,跟Rodolfo一起研究下相关知识. 本文介绍了两种方法来制作VR场景: 方法一:通过6张小图搭建的VR场景 方法二:通过一张全景图来搭建V ...
- Delphi多线程编程--线程同步的方法(事件、互斥、信号、计时器)简介
更详细的可以参考:http://www.cnblogs.com/xumenger/p/4450659.html 或者参考之后的博客 四个系统内核对象(事件.互斥.信号.计时器)都是线程同步的手段,从这 ...