Home > Developer > JavaScript
<! DOCTYPE html PUBLIC "-// W3C // dtd html 4.01 Transitional // EN" "http://www.w3.org/TR/html4/loose.dtd"> <ptml> <pead> <meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8 "> <title> Insert title here </title> <style type =" text/css ">. category_list {width: 200px; border: solid 1px #666666; height: 300px; position: relative ;}# category_list {list-style: none; margin: 0; padding: 0; padding-left: 20px; overflow: hidden; height: 298px;} # category_scroll {height: 298px; width: 15px; border: green solid 1px; position: absolute; right: 0; top: 0; font-size: 12px; cursor: hand;} # scrollup {height: 15px; width: 15px; border: green solid 1px;} # scroll_hand {height: 100px; width: 15px; border: green solid 1px; position: absolute;} # scrolldown {height: 15px; width: 15px; border: green solid 1px; position: absolute; bottom: 0 ;} </style> </pead> <body> <ul id = "category_list"> <li> 1 something </li> <li> 2 something </li> <li> 3 something </li> <li> 4 something </li> <li> 5 something </li> <li> 6 something </li> <li> 7 something </ li> <li> 8 something </li> <li> 9 something </li> <li> 10 something </li> <li> 11 something </li> <li> 12 something </li> <li> 13 something </li> <li> 14 something </li> <li> 15 something </li> <li> 16 something </li> <li> 17 something </li> <li> 18 something </li> <li> 19 something </li> <li> 20 something </li> <li> 21 something </li> <li> 22 something </li> <li> 23 something </li> <li> 24 something </li> <li> 25 something </li> <li> 26 something </li> <li> 27 something </li> <li> 28 something </li> <li> 29 something </li> <li> 30 something </li> </ul> scroll down </body> </ptml>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]
The problem is that when the scroll bar is clicked, the keyboard's up and down keys are triggered to control the up and down scrolling. However, in general, keyboard events only apply to Form objects and Winsow Form objects (except IE). How should we write them when creating event processing functions?
OEventUtil. addEventHandler (category_hand, "keyup", test) does not seem to work. After all, category_hand represents a DIV.
The test () function is as follows:
Function test (){
// Alert ("RUN ");
Var oEvent = oEventUtil. getEvent ();
If (oEvent. keyCode = 38 ){
Alert ("UP ");
ClickNarrowup ();
}
If (oEvent. keyCode = 40 ){
ClickNarrowdown ();
Alert ("DOWN ");
}
}
Please give me some help.
Question 2: in this Code, when defining variables, I inserted code in the middle of HTML to get objects. If this code is inserted to window. in the onload function, it is very likely that these objects have not been loaded and cannot be read, resulting in program errors. The problem is that if I want to completely:
<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>
How can we better deal with the introduction to Solution provided by the blueidea moderator
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
