1、新建a.html,b.html文件(此步骤需要了解html,css ,js的基础知识),详见下图:
2、注意a.html文件中跳转链接的填写
3、在b.html文件中引入jquery文件,需要注意原生javascript和JQuery的区别,本文采用JQuery的形式。
4、具体js内容的编写,简单的a链接完全可以实现跳转,但是跳转显得太突兀,使用js目的有两个:(1)跳转到b.html的特定位就女蒿鸳置;(2)在跳转过程中浏览器滚动条平滑滚动$(function() { var thisId = window.location.hash; var mao = $("#honor"); //获得锚点 if (thisId == "#honor") {//判断对象是否存在 var pos = mao.offset().top; $("html,body").animate({ scrollTop: pos}, 3000); } });
5、b.html文件中瞄点位置的书写:
6、为了加深了解,针对步骤4中关键js内容的进一步说明:
7、使用浏览器打来a.html,点击链接查看效果