我已经制作了一个onkeydown函数,它横向运行li元素块,它运行得很完美,但我需要当第一个和最后一个li块聚焦时,左右键应该被禁用.
有谁能建议一个正确的方法？ Thanx提前!!!
$(document).ready(function() {
var winht = $(window).height();
var contUl = $('.content ul').children('li').size();
var widLi = $('.content ul li').width();
var contUlAndLI = contUl * widLi;
var leftIndex = $('.content ul').css('left','0');
$('.content ul').width(contUlAndLI);
$('#frame').height(winht);
$("body").keydown(function(e) {
if(e.keyCode == 37) { // left
$(".content ul").animate({
left: "-=980"
});
}
else if(e.keyCode == 39) { // right
$(".content ul").animate({
left: "+=980"
});
}
});
if( leftIndex == 0){
$("body").keydown(function(e) {
if(e.keyCode == 39){ // right
//event.preventDefault();
return false;
}
});
}
});
工作参考是jsfiddle
解决方法
我是通过使用计数器来完成的,每次用户按下左或右时,都会检查其值.计数器只是ul标签内li元素的数量.
var ulCount = $('.content li').length - 1;
var i = 0;
然后,如果我们在计数器的值内,则只运行动画：
if(e.keyCode == 37) { // left
if (i < ulCount) {
i++;
$(".content ul").animate({
left: "-=980"
});
}
}
else if(e.keyCode == 39) { // right
if (i > 0) {
i--;
$(".content ul").animate({
left: "+=980"
});
}
}
我也更新了jsFiddle.
