Javascript模拟scroll滚动效果脚本
作者:
项目需要写了一段模拟Scroll滚动代码,分享的同时,我有些疑问,希望大家能帮忙解决,代码如下
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
现在有个问题就是当点中滚动条后,触发键盘的上下键,来控制上下滚动。然而,一般情况下,键盘事件似乎只针对Form表单对象和Winsow窗体对象起作用(除IE),那么当创建事件处理函数时该怎们写呢?
oEventUtil.addEventHandler(category_hand,"keyup",test),似乎是不行,毕竟category_hand代表的是一个DIV
test()函数如下:
function test(){
//alert("RUN");
var oEvent = oEventUtil.getEvent();
if(oEvent.keyCode==38){
alert("UP");
clickNarrowup();
}
if(oEvent.keyCode==40){
clickNarrowdown();
alert("DOWN");
}
}
请高手帮忙解答一下。
疑问二:这段代码中,在定义变量的时候我是在HTML中间插入的代码,用于获取对象,如果这段代码插入到window.onload函数中时,那么很有可能此时这些对象尚未加载,无法读取到而产生程序错误,那么问题就是,如果我想完全将:
<script type="text/javascript">
var category_scroll = document.getElementById("category_scroll");
var scroll_hand = document.getElementById("scroll_hand");
var scrollup = document.getElementById("scrollup");
var scrolldown = document.getElementById("scrolldown");
var category_list = document.getElementById("category_list");
</script>
引入到<head>之间怎们处理比较好呢?
blueidea版主给出的解决方法
1、键盘事件应加给window统一调配,根据category_hand激发状态判别处理。
2、放进function里,等页面加载完了再执行。
1、“键盘事件应加给window统一调配,根据category_hand激发状态判别处理”就是实现你这句话的策略:
“当点中滚动条后,触发键盘的上下键,来控制上下滚动”
category_hand被click时,将某个变量设为1,表示它被激活了。当网页内再发生鼠标按键事件时,解除激活。
某函数响应window对象的键盘事件,如果键盘事件发生时category_hand处于激活状态则执行相关代码。
2、获取页面元素对象,现在大家一般都用$()函数:
复制代码 代码如下:
function $(id) {
return document.getElementById(id);
}