各种HTML锚点跳转方式
1 js控制锚点跳转
<a name="anchor"></a>
location.hash="anchor";
不只有a其他元素也可以,比如在报表中:
<tr id="tr1">...</tr>
location.hash="tr1"
或者用jQuery的动画滚动效果:
var id="tr1";
$('html,body').animate({scrollTop: $("tr#"+id).offset().top}, 500);
2 html控制锚点跳转
<a href="#btn">跳转到点击位置</a>
<a name="btn" id="btn" > 点击</a>
3跨页面锚点跳转
代码如下
<a href="123.html#btn">跳到btn</a>
<a name="btn" id="btn" > </a>
4js控制锚点跳转在HTML中实现方式
- <div id="divNode"><!-- contents --></div><!-- 假设一个需要跳转到的节点 -->
- <a href="#" onclick="document.getElemetnById('divNode').scrollIntoView(true);return false;">通过scrollIntoView实现锚点效果</a>
各种HTML锚点跳转方式的更多相关文章
- html锚点的作用和js选项卡锚点跳转的使用
location是javascript里边管理地址栏的内置对象,比如location.href就管理页面的url,用location.href=url就可以直接将页面重定向url.而location. ...
- a 锚点跳转滑动效果
点击a链接时,跳转到相应id的位置处,有一个滑动效果. <a href="#my">我是跳转到div</a><div id="my" ...
- HTML meta锚点跳转 小tips
小tips meta锚点跳转 http://www.zhangxinxu.com/wordpress/2015/03/meta-http-equiv-refresh-content/
- JSP页面跳转方式
JSP页面跳转方式 1.利用按钮+javascript进行跳转 <input type="button" name="button2" value=&qu ...
- zepto的scrollTo,实现锚点跳转
实现功能:点击右侧字母A,实现锚点跳转功能: 有同学可能说可以直接用锚点跳转实现,是的,锚点跳转可以实现这个功能,但是有一个问题,点击跳转后,再点击返回,返回的是上次跳转的结果,具体的原理就不用多说了 ...
- ios中的界面跳转方式
ios中,两种界面跳转方式 1.NavgationController本身可以作为普通ViewController的容器,它有装Controller的栈,所以可以push和pop它们,实现你所说的跳转 ...
- JS页面打开方式丶对话框及页面跳转方式
一.js页面的三种打开方式 1. window.open 2. window.navigate("url") 跳转到目标页面 3. window.location.href=&qu ...
- JAVAEE学习——struts2_02:结果跳转方式、访问servletAPI方式、获得参数以及封装和练习:添加客户
一.结果跳转方式 <action name="Demo1Action" class="cn.itheima.a_result.Demo1Action" m ...
- JSP的几种跳转方式的异同
1 <jsp:foward page="url" /> 服务端跳转,立即跳转,后续语句不会执行: 2 <% response.sendRedirect(" ...
随机推荐
- BZOJ 2242: [SDOI2011]计算器 [快速幂 BSGS]
2242: [SDOI2011]计算器 题意:求\(a^b \mod p,\ ax \equiv b \mod p,\ a^x \equiv b \mod p\),p是质数 这种裸题我竟然WA了好多次 ...
- FileBeat安装配置
在ELK中因为logstash是在jvm上跑的,资源消耗比较大,对机器的要求比较高.而Filebeat是一个轻量级的logstash-forwarder,在服务器上安装后,Filebeat可以监控日志 ...
- Windows Azure Storage (25) Azure Append Blob
<Windows Azure Platform 系列文章目录> 在笔者之前的文章中,我们介绍了Azure Blob 有两种:Block Blob和Page Blob. 在这里笔者介绍Blo ...
- LeetCode - 596. Classes More Than 5 Students
There is a table courses with columns: student and class Please list out all classes which have more ...
- 当inline元素包裹block元素时会发生什么
经常有图片链接写法如下: <a href="www.baidu.com"><img src="baidu.jpg" /></a&g ...
- supervisor配置文件详解
介绍 Supervisor是一个进程控制系统. 它是一个C/S系统(注意: 其提供WEB接口给用户查询和控制), 它允许用户去监控和控制在类UNIX系统的进程. 它的目标与launchd, daemo ...
- SQL SERVER FOR LINUX初体验
今天得空,就在Ubuntu17.04上安装了SQL SERVER 2017体验下,总体来说还是不错的. 在Ubuntu上安装SQL SERVER 2017还是比较方便的,只需几条命令即可: curl ...
- Virtualbox以及VWare在Win10下的不兼容
异常处理汇总-开发工具 http://www.cnblogs.com/dunitian/p/4522988.html Hyper原因导致的,关闭即可 禁用 hyper-vbcdedit /set h ...
- hbase优化之region合并和压缩
HBASE操作:(一般先合并region然后再压缩) 一 .Region合并: merge_region 'regionname1','regionname2' ,'true' --true代表 ...
- 《android开发艺术探索》读书笔记(七)--动画
接上篇<android开发艺术探索>读书笔记(六)--Drawable No1: 自定义动画:派生一种新动画只需要继承Animation这个抽象类,然后重写它的initialize和app ...