我在这个 jfiddle 中举例说明了我的问题:https://jsfiddle.net/kLh8r294/2/
这是javascript:
$(document).ready(function() {
function close_accordion_section() {
$('.accordion .accordion-section-title').removeClass('active');
$('.accordion .accordion-section-content').slideUp(1000).removeClass('open');
}
$('.accordion-section-title').click(function(e) {
// Grab current anchor value
var currentAttrValue = $(this).closest('.accordion-section-title');
if(currentAttrValue.hasClass('active')) {
close_accordion_section();
}else {
close_accordion_section();
// Add active class to section title
currentAttrValue.addClass('active');
// Open up the hidden content panel
$('.accordion ' + currentAttrValue.attr('href')).slideDown(1000).addClass('open');
}
e.preventDefault();
});
});
其余部分在 jsfiddle 上。
当我打开 Accordion 并且内容很多时,内容会滚出屏幕。现在我做了一个“第一个”和“最后一个”的例子。
我想让焦点停留在 Accordion 标题上,例如,当它打开时,所以当内容离开屏幕时,用户仍然关注点击的 Accordion 的开头。如果它有点偏离 Accordion 的焦点,它应该平滑地滚动到它,而不是一次性跳转。
是否有任何内置于 jquery 或 javascript 中的东西可以使用? 我正在学习所有这些,所以任何帮助或洞察力都会得到帮助。
最佳答案
最简单的选择可能是 JS 中的最后一行:
document.getElementById("yourTargetSelector").scrollIntoView();
或:
document.getElementById(this).scrollIntoView();
关于javascript - 在屏幕外打开内容时的 Accordion 焦点,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35986302/