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中实现方式

  1. <div id="divNode"><!-- contents --></div><!-- 假设一个需要跳转到的节点 -->
  2. <a href="#" onclick="document.getElemetnById('divNode').scrollIntoView(true);return false;">通过scrollIntoView实现锚点效果</a>

各种HTML锚点跳转方式的更多相关文章

  1. html锚点的作用和js选项卡锚点跳转的使用

    location是javascript里边管理地址栏的内置对象,比如location.href就管理页面的url,用location.href=url就可以直接将页面重定向url.而location. ...

  2. a 锚点跳转滑动效果

    点击a链接时,跳转到相应id的位置处,有一个滑动效果. <a href="#my">我是跳转到div</a><div id="my" ...

  3. HTML meta锚点跳转 小tips

    小tips meta锚点跳转 http://www.zhangxinxu.com/wordpress/2015/03/meta-http-equiv-refresh-content/

  4. JSP页面跳转方式

    JSP页面跳转方式 1.利用按钮+javascript进行跳转 <input type="button" name="button2" value=&qu ...

  5. zepto的scrollTo,实现锚点跳转

    实现功能:点击右侧字母A,实现锚点跳转功能: 有同学可能说可以直接用锚点跳转实现,是的,锚点跳转可以实现这个功能,但是有一个问题,点击跳转后,再点击返回,返回的是上次跳转的结果,具体的原理就不用多说了 ...

  6. ios中的界面跳转方式

    ios中,两种界面跳转方式 1.NavgationController本身可以作为普通ViewController的容器,它有装Controller的栈,所以可以push和pop它们,实现你所说的跳转 ...

  7. JS页面打开方式丶对话框及页面跳转方式

    一.js页面的三种打开方式 1. window.open 2. window.navigate("url") 跳转到目标页面 3. window.location.href=&qu ...

  8. JAVAEE学习——struts2_02:结果跳转方式、访问servletAPI方式、获得参数以及封装和练习:添加客户

    一.结果跳转方式 <action name="Demo1Action" class="cn.itheima.a_result.Demo1Action" m ...

  9. JSP的几种跳转方式的异同

    1 <jsp:foward page="url" /> 服务端跳转,立即跳转,后续语句不会执行: 2 <% response.sendRedirect(" ...

随机推荐

  1. Perf工具

    前段时间Linux下用nmon监控程序的运行,发现CPU的使用率很高,系统态Sys的比例很高.程序的速度不是很快,怀疑和上面的原因有关. 分别使用perf record,perf report和top ...

  2. 文件锁FileLock

    1.文件锁的定义 FileLock是文件锁,进程锁,用于进程间并发,控制不同程序(JVM)对同一文件的并发访问. FileLock是java 1.4 版本后出现的一个类,它可以通过对一个可写文件(w) ...

  3. 微信小程序页面跳转的问题(app.json中设置tarBar后wx.redirectTo和wx.navigateTo均不能实现跳转到指定的页面)

    1.设置的tabBar代码片段: "tabBar": { "list": [ { "pagePath": "pages/homep ...

  4. 在控制台进行依赖注入(DI in Console)

    首先我们准备两个服务接口 public interface IServiceA { void showConsole(); int GetValue(int val); } public interf ...

  5. I can do it

    If it doesn't challange you ,it won't change you.

  6. git取消文件跟踪

    在使用git的时候,有些文件是不需要上传的,所以就可以修改   .gitignore 例如: 如果是对所有文件都取消跟踪的话,就是 git rm -r -cached .  //不删除本地文件 git ...

  7. linux下简洁优化部署tomcat应用

    本文来自我的github pages博客http://galengao.github.io/ 即www.gaohuirong.cn 摘要: 本文是自己根据公司架构部署tomcat方法整理出来的文本 修 ...

  8. linux下lampp(xampp)安装memcached扩展

    原理:根据自己的lampp中的php版本,编译memcache时,引用对应下载的php版本,并安装后的php_config来生成memcache.so文件,再将这个so文件放置到lamppp对应位置, ...

  9. ASP.NET Core的身份认证框架IdentityServer4--(4)添加第三方快捷登录

    添加对外部认证的支持 接下来我们将添加对外部认证的支持.这非常简单,因为你真正需要的是一个兼容ASP.NET Core的认证处理程序. ASP.NET Core本身也支持Google,Facebook ...

  10. spring core 与 context理解

    Spring core是核心层,拥有这BeanFactory这个强大的工厂,是所有bean的管理器: 而spring context是上下文运行环境,基于spring core之上的一个架构, 它之上 ...