Mouse

This topic describes how your application can receive input from a mouse.

Related Info

• Mouse Events

The user can interact with your application using a connected mouse.

<tizen:setting pointing-device-support='enable' />
<tizen:setting pointing-device-support='disable' />

Floating Menu

Floating menu is provided in the form of an overlay menu to navigate and use functions of a remote control by using the mouse right click.
The floating.navigation metadata key was introduced starting from 2024 products (Tizen 8.0) to configure the Floating menu.

• Enabling the Floating menu:
  The Floating menu is enabled by default. The floating.navigation metadata key does not need to be explicitly added to the application's "config.xml" to enable the Floating menu.

• Disabling the Floating menu:
  To disable the Floating menu, the value of the floating.navigation metadata key should be set to false.

<tizen:metadata key="http://samsung.com/tv/metadata/floating.navigation" value="false"/>

Floating menu types:

Type (1): Basic floating menu

• This is used if the application supports both input from mouse pointing-device-support='enable' and floating menu floating.navigation='true'.
• Below overlay menu appears when using the mouse right click.
  

Type (2): Floating menu with D-pad for screen navigation

• This is used if the application does not support input from mouse pointing-device-support='disable' but supports floating menu floating.navigation='true'.

• Below overlay menu appears when using the mouse right click.
  

• Below pop-up appears when using the mouse left click.
  

Handling Mouse Events

The supported mouse events are described in the W3C Mouse Events.

To receive notifications for mouse events, for example, the click event:

1. Create a listener for the click event. The listener is notified each time the element is clicked.

   <div id='button' ... onclick='handleKeyClick();'> ... </div>
   

   or

   document.getElementById('button').addEventListener('click', handleKeyClick);
   

2. Define the listener:

   function handleKeyClick () {
   // Something you want to do
   ...
   }