我正在尝试创建一个符合特定可访问性标准的网站,具有标签点击.问题是我在屏幕左侧有一个导航菜单,我的用户要求一个“跳到内容”类型的链接,所以他们不必不断地循环遍历多个链接到达内容的位置.
但是,我在我的网络应用程序中使用AngularJS,如果我使用标准的跳过内容功能(例如:http://accessibility.oit.ncsu.edu/training/accessibility-handbook/skip-to-main-content.html),它将无法正常工作.我已经使用了锚(带#)的角度代码.
有没有办法实现这一点?我有一个特定的div标签,我想要选项卡选择.它应该去div中的一个元素.
解决方法
之前我已经使用了
angular-scroll的效果.它是轻量级(8.5kB),易于使用,甚至为您照顾滚动动画.它也符合可访问性标准,因为Tab键可以像普通锚标签一样用于导航.
这样实现:
JS
angular .module('app',['duScroll']) .controller('MainCtrl',function ($scope,$document) { //Controller logic here }
HTML
<a href="#nav-one" du-smooth-scroll duration="1500">Navigation Link</a> <!-- further down the page --> <div id="nav-one"> Content goes here. </div>
工作CodePen参考:http://codepen.io/Pangolin-/pen/dPQRZa
快乐狩猎!