I had a little trouble getting the options to work? so I used a similar method instead.
I ended up taking out the options and just used mouseover, /* ============================================================ * 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 ) { var $elh = $(element).on('mouseover.dropdown.data-api', this.mouseover) 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 } , mouseover: function ( e ) { $(".open").removeClass('open') 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') if(!isActive){ clearMenus(); } !isActive && $parent.toggleClass('open') return false } } function clearMenus() { $(toggle).parent().removeClass('open') } /* DROPDOWN PLUGIN DEFINITION * ========================== */ $.fn.dropdown = function ( option ) { return this.each(function () { var $this = $(this) , data = $this.data('dropdown') if (!data) $this.data('dropdown', (data = new Dropdown(this))) if (typeof option == 'string') data[option].call($this) }) } $.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 13, 10:46 am, Gambah <marcelobot...@gmail.com> wrote: > 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 <marcelobot...@gmail.com> 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
