Developer Tips & Tricks - Prevent Highlighting of Content in Interactive Presentations

December 21, 2011

You may have noticed when interacting with an open source digital signage Presentation on a touch screen, or even when using the mouse in Preview mode, that it is sometimes possible to highlight images and text by dragging your finger or mouse over them. While not a major problem, you might prefer that these items not be selectable. Luckily, there is an easy way to do that with just a few lines of CSS.

Get started with Rise Vision

If you have added a Text Item to a Presentation, for example, and don't want to allow any of its content to be selectable, simply add the following CSS in the HTML view of the Text Item:

<style>
body {
-moz-user-select: none;
-webkit-user-select: none;
-khtml-user-select: none;
user-select: none;
}
</style>

You can also add this same CSS to the HTML of a Presentation. Take note, however, that it will have no effect on any Gadgets that are included in the Presentation. To have it apply to Gadgets as well, the CSS needs to be added directly to the Gadget's code.

We hope that you find this simple CSS trick useful!