Disable keyboard scrolling on webpage while playing game

Hi, I have embedded a game on a wordpress page and I have disabled keyboard scrolling on this page because when I moved my character up or down, the page would scroll too.

The disabled keyboard scrolling works for me but when I click on my game to make it active, the keyboard scrolling somehow is made active on my web page aswell,

anyone got a solution for this,? here is the page: http://www.digitizeenterprise.org/a-puzzling-enterprise/

1 Like

I forget what the code is, but I think there is a javascript/html element, something to the effect of “scrollbars=no”; I’m assuming this is what you used to stop the scrollbars on the page?

You might need to go into the index.html of your project and add the same code…

Also, if you don’t mind sharing, did you employ any particular methods to get your game embedded? I tried with iframes and embed but couldn’t get it working for some reason.

On a side note, I was unable to play the game. The screen resolution is too high and truncated the right side of my screen.

Thanks for the reply, I have inserted javascript to disable the coding but then whenever I click on my object (in this instance the game) it somehow enables the keyboard scrolling again.

Thanks for the note on the screen resolution I still need to make this suitable for mobile and tablets.

As for the embed code, I can share my code here, first of all I exported my game as html5 and uploaded it to the hosting and then added the following code: (I have removed the opening and closing tags and inserted slash as I dont know how to insert code here without it being removed

/object class=“game”/
/param name=“movie” value=“http://www.digitizeenterprise.org/swot_final_2/index.html”/
/embed src=“http://www.digitizeenterprise.org/swot_final_2/index.html” width=“1000” height=“578”/
//embed/
//object/

with the following css:

object.game {
align: middle;
margin-left: auto;
margin-right: auto;
width: 960px;
height: 560px;
border-style: solid;
border-color: #1faabe;
border-width: 5px;
}

1 Like

I wanted to follow up with this to thank you for sharing the method you used to create your game launcher.

I’ve been trying a bit here and there to get it working, and I finally found success (sort of). Evidently there’s a bug in the theme I’m using that prevents it from working. It shows up in the editor fine, but doesn’t display on a published page.

However, disabling my theme and activating the default 2020 theme did get it working as intended, so I can verify your method works just fine.

I’ve created a bug report at my themes community forums. Hopefully the theme developers can get this ironed out so I don’t have to switch themes and customize everything again.