I’m not sure this is even possible. I have a UI built that uses javascript and css, the interface users use a keypress to navigate. Css for the layouts that change per client, like a “skin”. Javascript controls the functions and monitors the users keypresses.
The setup has 2 menus, a lower one and upper one. When you load it the lower one is focussed and you can use left or right arrows to go between the menu items.
In normal circumstances you would press “up” to get an upper menu, however this one client does not want this menu at all.
The problem is that we cannot just simply edit the javascript to prevent it, since the same javascript is used for all the clients, only different css get loaded based on which client is selected.
So now I have the upper menu hidden, but the problem is that the javascript still allows you to press up, but now since the top menu is not there, you lose your focus, and nothing is highlighted. The end user doesn’t know why or how they lost focus if they press up by accident. (since they know no different setup where the top menu is there, they don’t realize that they should press down, they just know nothing seems to happen when they press left/right)
What I want to do, is somehow, in the css, prevent the users from pressing up. Since we can’t just go change the javascript.
Is this possible? Or is my only solution to modify the javascript?
TIA!!
Thanks to all who offer advise, just to clarify, we will make a new release with a function to check if the client wants this other menu, and disable the up button if not, however that will require a new release of the software, and a full pass through QA. Just trying to quick hack this one client in the mean time.. 🙂
Our final solution would have a boolean field in the database, and if it’s true, the javascript will have an ignore for the up key, if false, then act normally.
Unfortunately there is no correct way to disable components through css, for this type of functionality is meant for javascript.
The philosophy for most programmers that I have worked with is that you should allow the end user to decide if they want to use a new feature.
What I mean by this, is that you should leave an option in the app that lets the person disable the component themselves. This way you can have the same set of javascript for all users and still disable any component in the correct way. The real advantage to this is that you wont have to deal with this ticket ever again, the support staff could simply walk any client through the operation of recreating the requested feature.
Most of this solution might be unusable to you however. I understand it’s not easy changing your workplace convention.
Here is something that might be a little more useful, How do I disable form fields using CSS? Some of the advise might be applicable to any component, including menus.