欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

网页定位导航设计的知识点

程序员文章站 2022-04-18 09:21:11
...
  1. 锚点(anchor):锚点是页面内的超级链接
  2. 滚动条定位的事件和方法:

scroll:当用户滚动指定的元素时会发生scroll事件,scroll事件适用于所有可滚动的元素和window对象(浏览器窗口)。
例如:当页面滚动条发生变化时执行函数

$(window).scroll(function(){
    //滚动时执行的代码
});

scrollTop:获取/设置匹配元素相对滚动条顶部的偏移。
offset():获取匹配元素的相对偏移,返回的对象包含top和left,以像素为单位。

网页定位导航设计的知识点

  • A是1F到顶部的距离,B是2F到顶部的距离,C是3F到顶部的距离
  • 当滚动条S1滚动的距离介于B和C之间时,我们知道滚动条滚动到了2F,当S2滚动的距离介于A和B之间时,我们知道滚动条滚动到了1F。这样就知道了滚动条和楼层之间的关系,然后就可以通过楼层的id和锚点a标签对应起来。
    详细笔记及代码地址在:自行下载运行
相关标签: 导航锚点定位