|
JavaScript - Disable Arrow Keys
Disable Arrow Keys
I am creating an online flash gaming site, Aaron's Game Zone: http://azzaboi.weebly.com Some of the games on it use the arrow keys, however IE also uses them to scroll the page. I am learning JavaScript and am trying to write some script to pervent the page scrolling up and down while playing a game. For example... Guardian Rock uses the arrow keys to slide around, at the same time the page scrolls. http://azzaboi.weebly.com/guardianrock.html Here is the script I've tried to write to pervent the scrolling: Code: <script type="text/javascript">
function KeyPressHappened(e){
if (!e) e=window.event;
var key=e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
if(key == 37 || key == 38 || key == 39 || key == 40)
{
e.preventDefault();
return false;
}
return true;
}
document.onkeypress = KeyPressHappened;
</script>
There's a bug in it or it's not correct, no error message given, could anyone point out the mistake please? Similar Tutorialshi everybody; i'm using this code to trigger functions with left and right arrow keys.. but they work even if the arrow keys pressed in input boxes.. is there any way to prevent this code to work when user presses the arrow keys in input boxes? Code: document.onkeydown = function(evt) {
evt = evt || window.event;
switch (evt.keyCode) {
case 37:
geri();
gostergeyaz();
break;
case 39:
ileri();
gostergeyaz();
break;
}
};
On http://kisa.ca/cc/ I'm using JQuery's .keydown() to grab arrow keys. http://pastie.org/938572 But my friends using Linux are unable to use arrows to play the game: http://alteeve.com/files/cc.png Halp? I have a search box on my website, that gets users from my database using php. And uses Javascript to display suggestions as the users type. What I'd like to be able to is to use the arrows to toggle down through the different suggestions. Any ideas how I would go about doing this? Here's the javascript part of the code: Code: function createObject() {
var request_type;
var browser = navigator.appName;
if(browser == "Microsoft Internet Explorer"){
request_type = new ActiveXObject("Microsoft.XMLHTTP");
}else{
request_type = new XMLHttpRequest();
}
return request_type;
}
var http = createObject();
/* -------------------------- */
/* SEARCH */
/* -------------------------- */
function autosuggest() {
q = document.getElementById('search-q').value;
// Set te random number to add to URL request
nocache = Math.random();
http.open('get', 'lib/search.php?q='+q+'&nocache = '+nocache);
http.onreadystatechange = autosuggestReply;
http.send(null);
}
function autosuggestReply() {
if(http.readyState == 4){
var response = http.responseText;
e = document.getElementById('results');
if(response!=""){
e.innerHTML=response;
e.style.display="block";
} else {
e.style.display="none";
}
}
}
I am trying to assign the left and right arrows, but I cannot get the code to work. It would be great to get some help--I am a newbie to coding. <html> <head> <script language="javascript" type="text/javascript"> document.onkeydown=function(e) { var thelink if (e.keyCode==37) thelink='prevlink' else if (e.keyCode==39) thelink='nextlink' else return document.location.href=document.getElementById(thelink).href} </script> </head> <body> <a href="#" onkeydown="return previous(this)" id="prevlink">PREVIOUS</a><br /> <br /> <a href="#" onkeydown="return next(this)" id="nextlink">NEXT</a> </body> </html> I have three buttons on a typical page (sample page: http://jimoberst.com/paintings/p18.html). One goes to the previous page, one to the next, and one up a level. Can I link these buttons to 3 arrow keys to simplify navigation for the user? I thought this would be a common task, but I cannot find any canned code on the web to do it. I can code simple html, but don't know javascript. Thanks!
I want to use an onkeydown() on my web site and the web site to know which key I pressed. Specifically know I pressed the arrow keys and store which key was pressed in a variable. any help? must work on all browsers. I've seen websites that have things like feedback and an arrow facing up that either take you to the top of the page or opens a form to give your feedback.
Hey! I searched a while on the web for this but i didn't find a solution that really worked. So is there a way how i can prevent IE9 from scrolling when i use the arrow keys? Hi All, I have a javascript scrollbar in the middle of the webpage, with two images as arrow at both end. Onclick of up and down arrow images the inside content moves up and down respectively. All works fine. What I need is, when I scroll down the down arrow should be disabled or invisible (as there is nothing to scrolldown) and same way when the content is at the top, the up arrow should be disabled or invisible. Please help... Sharing the code : <body> <script src="http://milansolutions.com/file_depot/0-10000000/20000-30000/29948/folder/92044/dw_event.js" type="text/javascript"></script> <script src="http://milansolutions.com/file_depot/0-10000000/20000-30000/29948/folder/92044/dw_scroll.js" type="text/javascript"></script> <script src="http://milansolutions.com/file_depot/0-10000000/20000-30000/29948/folder/92044/scroll_controls.js" type="text/javascript"></script> <script type="text/javascript"> function init_dw_Scroll() { var wndo = new dw_scrollObj('wn1', 'lyr1'); wndo.setUpScrollControls('scroll_links'); wndo.setUpScrollControls('wn1'); var wndo2 = new dw_scrollObj('wn2', 'lyr2'); var wndo3 = new dw_scrollObj('wn3', 'lyr3'); wndo3.setUpScrollbar("dragBar", "track", "v", 1, 1); wndo3.setUpScrollControls('scrollbar'); wndo3.setUpScrollControls('extra_controls'); wndo3.setUpScrollControls('wn3'); } if ( dw_scrollObj.isSupported() ) { dw_writeStyleSheet('http://milansolutions.com/file_depot/0-10000000/20000-30000/29948/folder/92044/vert.css'); dw_Event.add( window, 'load', init_dw_Scroll); } </script> <link rel="stylesheet" href="http://milansolutions.com/file_depot/0-10000000/20000-30000/29948/folder/92044/vert.css" media="screen"> <h2>Demonstration</h2> <div class="holder1"> <div class="hasImage scroll_controls" id="scroll_links"> <a class="mouseover_up up" href=""><img src="http://milansolutions.com/file_depot/0-10000000/20000-30000/29948/folder/92044/tri-up.gif" alt="" width="12" height="12"></a> <a class="mouseover_down dn" href=""><img src="http://milansolutions.com/file_depot/0-10000000/20000-30000/29948/folder/92044/tri-dn.gif" alt="" width="12" height="12"></a> </div> <div id="wn1"> <div style="left: 0px; top: 0px; visibility: visible;" id="lyr1"> <h3>Mouseover Scrolling </h3> <p>This example demonstrates vertical scrolling using mouseover links. Scroll speed is adjustable.</p> <p>Mouse down on the arrows to see the speed double. Original speed resumes on mouseup.</p> <p>The documentation provides information for setup. The download file contains examples in individual files for your convenience and ease of implementation.</p> <p>The code supports the capability to hide or swap images when the end is reached. Further information is provided upon request to licensed users of the code.</p> <p>Content repeated for your scrolling pleasure </p> <p>This example demonstrates vertical scrolling using mouseover links. Scroll speed is adjustable.</p> <p>Mouse down on the arrows to see the speed double. Original speed resumes on mouseup.</p> <p>The documentation provides information for setup. The download file contains examples in individual files for your convenience and ease of implementation.</p> <p>The code supports the capability to hide or swap images when the end is reached. Further information is provided upon request to licensed users of the code.</p> <p>Back to the <a href="#" class="click_up_to_0_0">top</a></p> </div> </div> </div> Hello. I want to move something with the arrow keys, but some aprt of script is incorrect and it's not working Code: </style>
<script type="text/javascript">
function setup() {
row=0;
col=0;
imageSnake(row,col);
}
</script>
</head>
<body onload="setup()" onkeydown="handleKey(event)">
<center>
<script type="text/JavaScript">
document.write('<table border="1" cellspacing="0" cellpadding="10">')
var count =0
for (var row=0; row<20; row++) {
document.write('<tr>');
for (var col=0; col<20; col++) {
document.write('<td style="border:0"; id="count++";>');
document.write('</td>');
}
document.write('</tr>');
}
function handleKey(e) {
if (e.type == 'keydown' && (e.keyCode == 27 || (e.keyCode >= 37 && e.keyCode <= 40))) {
switch(e.keyCode) {
case 37:
dC = -1;
dR = 0;
break;
}
emptyCell(row,col);
function emptyCell
var id = 'r' + r + 'c' + c;
var cell = document.getElementById(id);
if (cell) cell.innerHTML='';
}
row += dR
col += dC
function insertImage(r,c) {
var id = 'r' + r + 'c' + c;
var cell = document.getElementById(id);
var color = cell.className;
if (color != 'white') {
var image = 'img.gif';
}else{
var image = 'img2.gif';
}
cell.innerHTML = '<img src="" + image + alt="" + color + 'image' />';
}
</script>
Thank you for any noticed error. I have a randomly generated Language file that corresponds to keys, the reason Ii say randomly generated is that the letter to key values used are not standard assignments. It seems the language coding is DEC in sets of 3 values by 5 .i.e. "248 036 034 036 248" = A "036 084 084 084 120" = a (See attached : ENGLISH-1.txt) How would I assign these values to a sentence lets say: All great : 248 036 034 036 248 ll gre 036 084 084 084 120 t but convert all characters to their correspondnig sets of 5 ? This then needs to get sent to a database where it is interpreted into sets of Binary to turn on and off LEDs' ... I have never worked with Javascript or LED's before, so any help is so appreciated. Hello, I am using some api solutions in my javascript. But, those api solutions require api keys as parameters. In this case, users can see my api keys by displaying page source? What is a true approach and solution of course? Thanks I need to disable some keys from their default behaviour in Google Chrome on Windows with javascript. The script below works for most keys but not for F10, left Windows key, right Windows key, NumLock and left Alt. (which are the keys I need to disable) Code: <script type="text/javascript">
addEventListener("keydown", function (event) {
if(KeyID == 121 KeyID == 91 || KeyID == 92 || KeyID == 144|| KeyID == 18 ){
event.preventDefault();
}
}, true);
</script>
I have also without luck tried event.stopPropagation () - event.cancelBubble = true - return false og void(). I would like to know if their is a solution or it simply isn't possible to disable the mentioned keys. How to use the shortcut keys in jvascript? Can someone illustrate it to me with an example? Such as suppose on clicking the Ctrl+alt key,i want to display a prompt dialog box........How to do this? Need some urgent help..... thank you in advance Hi all, I was under the impression that I and object/associative array could have other objects as the keys for properties. That is, I should be able to set myObject[anotherObject] = 1. However, while this seems to work at first glance, any new object I set as a property key overwrites the first one. Here is the result of me testing in my Chrome console: Code: > var obj1 = new Object();
> var obj1.someProperty = "test"
"test"
> var obj2 = new Object();
> obj2.someOtherProperty = "test2"
"test2"
> obj1 == obj2
false
> obj1 === obj2 // the two objects I created are definitely not the same
false
> x = {}
> x[obj1] = 0 // set the two objs as property keys on x
0
> x[obj2] = 1
1
> x[obj1]
1 // blargh! x.obj2 overwrote x.obj1!
Any idea if this is possible, and if I'm just messing up with something dumb? Hello, Into an external js file, I'm trying to use the facebook graph api to read values of "shares" and "comments" and import them into js variables. As example, using http://graph.facebook.com/?id=http://www.google.com in the browser, I get the following response: Code: {
"id": "http://www.google.com",
"shares": 3208837,
"comments": 2
}
In my js code, I need something like: var val_shares=xx; var val_comments=xx; Here's the code I'm using to (try) do it: Code: function getNewHTTPObject()
{
var xmlhttp;
/** Special IE only code ... */
/*@cc_on
@if (@_jscript_version >= 5)
try
{
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
try
{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (E)
{
xmlhttp = false;
}
}
@else
xmlhttp = false;
@end @*/
/** Every other browser on the planet */
if (!xmlhttp && typeof XMLHttpRequest != 'undefined')
{
try
{
xmlhttp = new XMLHttpRequest();
}
catch (e)
{
xmlhttp = false;
}
}
return xmlhttp;
}
var xmlHttp = getNewHTTPObject();
function getDynamicData()
{
var url = "http://graph.facebook.com/?id=http://www.google.com";
xmlHttp.open('GET', url, true);
xmlHttp.onreadystatechange = callbackFunction;
xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlHttp.send(null);
}
var syndLinkRequest = getNewHTTPObject();
function callbackFunction()
{
if (syndLinkRequest.readyState != 4)
return;
var result = xmlHttp.responseText;
}
into the HTML I call getDynamicData() at <body onload=getDynamicData()>... Using Firefox in console mode, I see that the results arrive at this point of code: Code: xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlHttp.send(null);
But I do not know (or understand) how and where to get those value to associate them to a js variable. I understood I will need to use json to achieve this but I don't know where to start. In addition, I can't use jQuery or php to do it. After 2 days of searches, I'm about to give up. Does anyone have an idea how to do or where I can find a concrete sample to show me the right way ? Thanks a lot. Gino I found strange for the following code: Code: var allextRules = Ext.util.CSS.getRules();
Object.keys(allextRules).forEach(function(key) {
var keyname = key;
if(keyname.indexOf("js") != -1){
Ext.util.CSS.removeStyleSheet(keyname);
console.log(keyname + " Removed");
}
});
When the above work is tested in other browser (say - Google Chrome), there is no error. However, when tested in IE 9, there is error as follows: Code: SCRIPT438: Object doesn't support property or method 'keys' According to this article (https://developer.mozilla.org/en/Jav...ts/Object/keys), the Object.keys is supported by IE. Have I miss out something? Is it possible to disable all scripts within a certain div? Like if I was displaying something in <div id="member"> and a member posts a script within that div, I would like it to not work.
Is there a way to disable a SINGLE script on the page, something that a user can click and it disables only the script choosen? Thanks, Latchy |
|||||||