使数据属性表现得像锚点
Make a data-attribute behave like an anchor
是否有可行的方法使数据属性表现得像锚?
考虑以下可能的情况:
<a id="link" href="#home">
<div data-section="home">
是否有可能以某种方式将锚标记绑定到具有相同命名数据属性的 div?
这不起作用,但有点像:
$("#link").click(function(e) {
var clickedLetter = $(this).attr('href');
$(this).attr("href", "#section[data-group='" + clickedLetter + "']")
});
kawnah,我认为你需要获取点击元素的 href
var clicked = $(this).attr('href');
之后,您可以使用替换功能并获取没有标签符号 (#) 的 href
var myAttr = replace('#', clicked);
最后一个你应该做的是动画主体到元素有这个数据部分
var elementScrolledTo = $('*[data-section="' + myAttr + '"]');
$('html, body').animate({
scrollTop: elementScrolledTo.offset().top
}, 2000);
当然,这是jquery事件的处理函数。
http://api.jquery.com/on/
是否有可行的方法使数据属性表现得像锚?
考虑以下可能的情况:
<a id="link" href="#home">
<div data-section="home">
是否有可能以某种方式将锚标记绑定到具有相同命名数据属性的 div?
这不起作用,但有点像:
$("#link").click(function(e) {
var clickedLetter = $(this).attr('href');
$(this).attr("href", "#section[data-group='" + clickedLetter + "']")
});
kawnah,我认为你需要获取点击元素的 href
var clicked = $(this).attr('href');
之后,您可以使用替换功能并获取没有标签符号 (#) 的 href
var myAttr = replace('#', clicked);
最后一个你应该做的是动画主体到元素有这个数据部分
var elementScrolledTo = $('*[data-section="' + myAttr + '"]');
$('html, body').animate({
scrollTop: elementScrolledTo.offset().top
}, 2000);
当然,这是jquery事件的处理函数。 http://api.jquery.com/on/