jQuery箭头滚动

时间:2013-06-01 17:26:03

标签: jquery smooth-scrolling

目前我的单页网站有4个不同的部分,高度为100%(主要容器)。我可以使用箭头键滚动到每个部分。单击它们时,我的导航链接也会保持突出显示。问题是通过向下滚动页面我的jQuery不记得位置。此外,如果我单击导航链接并滚动到下一部分(使用鼠标),链接将保持突出显示,并且不会更改为当前部分。非常感谢帮助。

这是我的小提琴http://jsfiddle.net/phUxg/2/

的jQuery

$(document).ready(function() {
$(function() {
var lengthDiv = $('.desktop').find('li').length;
var current = 0;
$('a').bind('click',function(event){

var $anchor = $(this);
current = $anchor.parent().index();

$('html, body').stop().animate({
    scrollTop: $($anchor.attr('href#')).offset().top
}, 1500,'easeInOutExpo');
/*
if you don't want to use the easing effects:
$('html, body').stop().animate({
    scrollTop: $($anchor.attr('href')).offset().top
}, 1000);
*/
event.preventDefault();
});
$(document).keydown(function(e){if($(':focus').length <= 0)e.preventDefault()})
$(document).keyup(function(e){
    var key = e.keyCode;
    if(key == 38 && current > 0){
        $('.desktop').children('li').eq(current - 1).children('a').trigger('click')
    }else if(key == 40 && current < lengthDiv){
        $('.desktop').children('li').eq(current + 1).children('a').trigger('click')
    }
})
});

$(document).ready(function() {
$(".desktop a").click(function() {
$(".desktop a").removeClass("selected");
$(this).addClass("selected"); 
});
});
});

0 个答案:

没有答案