Advanced User Interface Controls and Components

IntegralUI Web

Documentation and API Reference


Determines whether a group can be selected while mouse cursor hovers over its header.

Property Value

A Boolean value. The default is false, stating that groups will not become selected when mouse cursor hovers over their header.


When group is hovered, groupHover event is thrown. Additionally, when this property is set to true, it triggers the beforeSelect and afterSelect events.

Version Information

Supported in: v1.0.


In this example the Accordion widget has hoverSelection set to true. This enables whenever a mouse cursor is hovering over group space longer than 500ms, to change the current selection to the group that is hovered.

$(document).ready(function() {

// Create an instance of Accordion widget

var $bar = $('#accordion').accordion({

hoverSelection: true



<!DOCTYPE html>



<link rel="stylesheet" href="css/integralui.accordion.css" />

<link rel="stylesheet" href="css/themes/theme-blue.css" />

<script type="text/javascript" src="external/jquery-1.9.1.min.js"></script>

<script type="text/javascript" src="external/jquery.ui.core.min.js"></script>

<script type="text/javascript" src="external/jquery.ui.widget.min.js"></script>

<script type="text/javascript" src="js/jquery.integralui.widget.min.js"></script>

<script type="text/javascript" src="js/jquery.integralui.accordion.min.js"></script>



<div id="accordion" class="widget">

<h3><span>Group 1</span></h3>


<h3><span>Group 2</span></h3>


<h3><span>Group 3</span></h3>







width: 300px;

height: 300px;


See Also