Text highlighting on button hold

Hi,

I have a few buttons that are designed to be held down for a period of time, and then released. However when the user holds on the text of the button, the button gets released and the text gets highlighted. I can't seem to disable the text highlighting on buttons, I would imagine there is a way to inject some CSS into the styling or ideally the style class but cannot figure out where to do that at. Any direction would be great, thanks in advance.

Yeah, don't. If you are trying to do a jog operation, you should know that it cannot be made safe to do from Perspective. (And is difficult outside Perspective, too.)

Unfortunately I was just the one told to design something to be a momentary button without any input on the design choices... I have something in place that works but only when the text does not get highlighted..

There's a reason Perspective does not offer a momentary pushbutton, at all. Cobbling one together is not a good idea.

If you absolutely must have one, deploy Vision and use one of the continuous incrementing write techniques to make the complete comms path reliable.

Correct, I agree pushbuttons in general are a bad idea. However that is not what I am inquiring about.

I would like to know if there is a way to include CSS styling in style classes so that I can turn off the highlighting of button text when it gets held down. This is useful for many things related to usability.

If you insist on pursuing this you could try using a coordinate view and placing a button without text and a transparent fill over a label with the required background.

If you're using this for a jog function, or similar, then make sure the PLC switches off the output after the maximum safe time. You might want to get someone in management to sign off on the risk that you are introducing at their request.

i dont really have this highlighting issue.
anyways you could try adding adding this to styles
user-select: none

2 Likes

This works great, especially in conjunction with stylesheets.css that lets you append true CSS to already existing style classes. Thanks!

Btw note that this may not behave everywhere the same, some browsers cascade this effect to all nested childeren, some don't,

So you might need to find the correct css selector for some components.

This also is no form of security

2 Likes