查看更多

巧用HTML组件+链接实现锚点功能

锚点是网页制作中超级链接的一种,又叫命名锚记。命名锚记像一个迅速定位器一样是一种页面内的超级链接,运用相当普遍。 使用命名锚记可以在文档中设置标记,这些标记通常放在文档的特定主题处或顶部。然后可以创建到这些命名锚记的链接,这些链接可快速将访问者带到指定位置。 创建到命名锚记的链接的过程分为两步。


首先来科普一下什么是锚点。


       锚点是网页制作中超级链接的一种,又叫命名锚记。命名锚记像一个迅速定位器一样是一种页面内的超级链接,运用相当普遍。


        使用命名锚记可以在文档中设置标记,这些标记通常放在文档的特定主题处或顶部。然后可以创建到这些命名锚记的链接,这些链接可快速将访问者带到指定位置。

创建到命名锚记的链接的过程分为两步。


(1)创建命名锚记

(2)创建到该命名锚记的链接,也就是链接到锚点。


       9466目前没有直接提供锚点的功能,但也可以通过一些功能的组合,做到锚点的效果。后面9466或考虑更大家提供更加便捷的锚点使用方法


        举个简单的例子,在科比超越乔丹的专题中,需要把菜单链接到对应的内容区域,这时候,就有必要用上锚点了。

        

        QQ20141216-7.jpg


       我们来一一分解下实现的步骤。


       (1)在需要使用锚点定位的地方埋下锚点

          在需要使用锚点定位的地方拖放一个html组件->添加锚点->保存 ,我们可以看到,锚点已经存在了,点击确定,保存HTML组件的内容。


           


         

        (2)链接到锚点


          链接到锚点这里体验并不太好,也是部分同学找不到做锚点的原因。后面版本升级时考虑优化。


         

         链接到锚点时,我们需要知道锚点的名字,如 上面的“纪录时刻”的锚点名字为“record”    



         我们选中导航,给导航添加链接。链接的组成是 当前页面的访问url+#+锚点名字,如 http://www.9466.com/#锚点名字,

在这里,我们知道当前页面的访问链接地址是 http://www.9466.com/project/MDAwMTQwM5DY1/anchor.html ,那纪录时刻锚点链接就是 http://www.9466.com/project/MDAwMTQwM5DY1/anchor.html#record


         选中导航中的纪录时刻 -> 点击链接图标添加链接 -> 确定保存。



          



可以打开页面 http://www.9466.com/project/MDAwMTQwM5DY1/anchor.html 查看效果。



记住,这里有一个前提,你需要知道你的页面发布后的访问地址,才能用此方法做锚点链接。



我们在后续的版本将考虑优化锚点的使用流程。


         


           

        


        

        



推荐阅读

9466网页助手 网页制作软件 © 2013 版权所有 | 京ICP备09082107号      京公网安备11010802012193号