使用scrollTo插件并单击并按住功能可在页面上添加导航元素
||
您可以在www.highdwellercreative.com/colife上查看该站点。该站点基于城市将随着公司的发展而发展的概念，我们想要一种不同的感觉，然后使用提供的滚动条进行滚动。我一直在研究导航的键盘样式，该样式由四个方向箭头（上，下，左，右）组成。
我目前正在使用setInterval（）函数在mousedown（）上循环scrollTo插件，并使用clearInterval（）函数在mouseup（）上结束循环。
我也将间隔设置为重复1毫秒，以实现平滑滚动。我已经包含了使我到目前为止可以完成的工作的代码，但是它仍然有些粗糙，尤其是在Firefox 4中。到目前为止，它在所有浏览器（包括IE）中都可以正常工作，但是看起来会更加流畅，我失去了如何做到这一点。同样，如果您单击导航按钮之一，然后立即在其上单击鼠标右键，则该页面将在该方向滚动。任何有关如何改善这一点的帮助将不胜感激。
var rightId;
$(\'span#right\').mousedown(function() {
rightId = setInterval(function(){$.scrollTo(\'+=5px\', {axis:\'x\'})}, 1);
}).mouseup(function() {
clearInterval(rightId);
});
var leftId;
$(\'span#left\').mousedown(function() {
leftId = setInterval(function(){$.scrollTo(\'-=5px\', {axis:\'x\'})}, 1);
}).mouseup(function() {
clearInterval(leftId);
});
var upId;
$(\'span#up\').mousedown(function() {
upId = setInterval(function(){$.scrollTo(\'-=5px\', {axis:\'y\'})}, 1);
}).mouseup(function() {
clearInterval(upId);
});
var downId;
$(\'span#down\').mousedown(function() {
downId = setInterval(function(){$.scrollTo(\'+=5px\', {axis:\'y\'})}, 1);
}).mouseup(function() {
clearInterval(downId);
});
没有找到相关结果
已邀请:
1 个回复
抬澈帅沮
function moveAround(elem,dir,moveAxis) { var moving; $(elem).mousedown(function() { moving = setInterval(function(){$.scrollTo(dir+\'=5px\', {axis:moveAxis})}, 1); }).mouseup(function() { clearInterval(moving); }); } moveAround(\'span#left\',\'-\',\'x\'); moveAround(\'span#right\',\'+\',\'x\'); moveAround(\'span#up\',\'-\',\'y\'); moveAround(\'span#down\',\'+\',\'y\');