I made changes to use the dropdown with mouseover.
Tested only in firefox. If anyone has suggestions or modifications
reply the comment.
Function call:
$('.dropdown-toggle').dropdown({ trigger : 'hover' });
fuction (change the dropdown on the bootstrap.js):
/* ============================================================
* bootstrap-dropdown.js v2.0.0
* http://twitter.github.com/bootstrap/javascript.html#dropdowns
* ============================================================
* Copyright 2012 Twitter, Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* ============================================================ */
!function( $ ){
"use strict"
/* DROPDOWN CLASS DEFINITION
* ========================= */
var toggle = '[data-toggle="dropdown"]'
, Dropdown = function ( element, options ) {
if (options.trigger == 'hover') {
var $elementParent = $(element).parent()
$elementParent.on('mouseenter.dropdown.data-api', this.enter)
$elementParent.on('mouseleave.dropdown.data-api', this.leave)
}else{
var $el = $(element).on('click.dropdown.data-api',
this.toggle)
$('html').on('click.dropdown.data-api', function () {
$el.parent().removeClass('open')
})
}
}
Dropdown.prototype = {
constructor: Dropdown
, toggle: function ( e ) {
var $this = $(this)
, selector = $this.attr('data-target')
, $parent
, isActive
if (!selector) {
selector = $this.attr('href')
selector = selector && selector.replace(/.*(?=#[^\s]*$)/,
'') //strip for ie7
}
$parent = $(selector)
$parent.length || ($parent = $this.parent())
isActive = $parent.hasClass('open')
clearMenus()
!isActive && $parent.toggleClass('open')
return false
}
, enter: function ( e ) {
var $this = $(this)
, child = $this.children()[0]
, selector = $(child).attr('data-target')
, $parent
, isActive
if (!selector) {
selector = $(child).attr('href')
selector = selector && selector.replace(/.*(?=#[^\s]*$)/,
'') //strip for ie7
}
$parent = $(selector)
$parent.length || ($parent = $(child).parent())
isActive = $parent.hasClass('open')
!isActive && $parent.addClass('open')
}
, leave: function ( e ) {
var $this = $(this)
, child = $this.children()[0]
, selector = $(child).attr('data-target')
, $parent
, isActive
if (!selector) {
selector = $(child).attr('href')
selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') //
strip for ie7
}
$parent = $(selector)
$parent.length || ($parent = $(child).parent())
isActive = $parent.hasClass('open')
isActive && $parent.removeClass('open')
}
}
function clearMenus() {
$(toggle).parent().removeClass('open')
}
/* DROPDOWN PLUGIN DEFINITION
* ========================== */
$.fn.dropdown = function ( option ) {
return this.each(function () {
var $this = $(this)
, data = $this.data('dropdown')
, options = $.extend({}, $.fn.dropdown.defaults, typeof option
== 'object' && option)
if (!data) $this.data('dropdown', (data = new Dropdown(this,
options)))
if (typeof option == 'string') data[option].call($this)
})
}
$.fn.dropdown.defaults = {
trigger: 'click'
}
$.fn.dropdown.Constructor = Dropdown
/* APPLY TO STANDARD DROPDOWN ELEMENTS
* =================================== */
$(function () {
$('html').on('click.dropdown.data-api', clearMenus)
$('body').on('click.dropdown.data-api', toggle,
Dropdown.prototype.toggle)
})
}( window.jQuery )
On Feb 10, 4:01 pm, Marcelo Botega <[email protected]> wrote:
> Hello,
>
> Somebody already used dropdown with mouseover ?
> There is the option in the bootstrap for this?
>
> Sorry for my poor English.
> --
> Atenciosamente,
>
> Marcelo Botega Fontana
> *Desenvolvedor Web - Nexxera TechPeople*
> Tecnólogo em Redes de Computadores
> (48) 8449-3985
