How do I prevent scrolling with arrow keys but NOT the mouse?

JavaScript
1

I have a problem with slider it scrolls left and right when I use keyboard left and right arrow keys.
I want to disable this but I didn’t get any solution.

I am not able to upload any code because I am a new user and it shows that new user can not upload any attachments.
If you want the code then you have to save the page and then you get the code.

When you don’t select any category then keyboard left and right arrow keys are not working but when you select any category then keys are working.

If you go through this URL " http://www.pfyidev.apikdd.com/ " and then go to “Electronics” section and then select “Cameras” tab and then use keyboard left and right arrow keys then it scroll. I want to disable it.

I use this JS for disabling the arrow keys.

var ar=new Array(37,39);
$(document).keydown(function(e) {
     var key = e.which;
      //console.log(key);
      //if(key==35 || key == 36 || key == 37 || key == 39)
      if($.inArray(key,ar) > -1) {
          e.preventDefault();
          return false;
      }
      return true;
});

Please give me the solution.
Thank you!

2

It depends on what browser you use.

There should be something like “Preferences”, “Settings”, “Options”

Then from there it could be something like “Accessibility”, “Keyboard”

Then there should be something like “Arrow keys for navigation”

I suggest you spend some time getting familiar with what your browser has available, but if you post what browser you’re using someone should be able to give you the exact steps needed to get to the particular setting.

3

It happens in all the browsers.

4

Well, yes, I guess all browsers should have accessibility settings.

Have you not been able to find the settings in any of them?

5

I believe @Praveen_Kumar_Verma is trying to find a way to over-ride the native function of his visitors’ browsers and prevent them using the arrow keys. I’m not sure why anyone would want to do this. Preventing the normal functioning of the browser is never a good idea, and may leave visitors with the impression that the site is broken.

6

One has to ask why would you want to do this?

7

After some experimentation I realize that it’s not the Electronics in the nav bar, but the Electronics section of the page, and you want us to click in the categories list on the Cameras category.

From what I can gather, you want to affect the carousel, to prevent the keyboard navigation of the carousel.

Which type of carousel slider are you using there?

8

In home.js you have this function:

function load_slider(slider_id,id){
	var str1 = "mc"+slider_id+"Slider";
	var res = str1.concat(id);
		setTimeout( function(){		
		var tt = window[slider_id+"SliderOptions"+id];
		var tt =
		{
		sliderId: slider_id+"-slider"+id,
		orientation: "horizontal",
		thumbWidth: "auto",
		thumbHeight: "60px",
		showMode: 4,
		autoAdvance: false,
		selectable: false,
		slideInterval: 3000,
		transitionSpeed: 1500,
		shuffle: false,
		startSlideIndex: 0, //0-based
		pauseOnHover: true,
		initSliderByCallingInitFunc: false,
		rightGap: 0,
		keyboardNav: true,
		mousewheelNav: false,
		before: null,
		license: "b2p70"
		};
		var res = new ThumbnailSlider(tt); 
		$("#"+slider_id+"-slider"+id+"-prev").addClass("slider-prev");
		$("#"+slider_id+"-slider"+id+"-next").addClass("slider-next");
		$('[data-toggle="tooltip"]').tooltip();		
	},1500);

One of the options in the above is this:

keyboardNav: true,

It is likely that the above may be controlling the keyboard for the slider (although I can’t test from here) so try changing that to false:

keyboardNav: false,

However as others have said this is a great aid for keyboard users and it would be amiss to remove it.

9

Setting a breakpoint in that area does confirm that code execution goes through there. That’s most likely to be the answer at this stage.

:+1:

1 Like
10

It does seem a particular shame to use a script which has actually been designed to be accessible for keyboarders (so many aren’t ) and then remove that accessibility.

@Praveen_Kumar_Verma: you do understand that some visitors may be unable to use a mouse and rely on keyboard navigation, don’t you?

1 Like
11

Thank you.
Actually, this js is not written by me that’s why I am not aware with this js.
Thank you once again.

12

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.