mdbootstrap / bootstrap-hover-dropdown

An unofficial Bootstrap plugin to enable Bootstrap dropdowns to activate on hover and provide a nice user experience.
http://cameronspear.com/demos/bootstrap-hover-dropdown/
MIT License
1.26k stars 503 forks source link

doesnt work with only img tag inside dropdown-togggle link #134

Open Hortt opened 9 years ago

Hortt commented 9 years ago

here is the layout:

<div class="visitor_tab">
    <a href="#" id="user_icon" class=" " data-toggle="dropdown" data-hover="dropdown" aria-expanded="false">
        <img alt="" src="http://0.gravatar.com/avatar/f1cb99d9aba841d2121d3a42b4e7a6ac?s=36&amp;d=mm&amp;r=g" srcset="http://0.gravatar.com/avatar/f1cb99d9aba841d2121d3a42b4e7a6ac?s=72&amp;d=mm&amp;r=g 2x" class="avatar avatar-36 photo" height="36" width="36">                                
    </a>
    <ul class="dropdown-menu" role="menu">
        <li role="presentation">
            <a role="menuitem" tabindex="-1" href="#">Watch Later</a>
        </li>
        <li role="presentation">
            <a role="menuitem" tabindex="-1" href="#">Latest</a>
        </li>
        <li role="presentation">
            <a role="menuitem" tabindex="-1" href="#">Recomended</a>
        </li>
    </ul>
</div>
jmartin84 commented 9 years ago

What browsers are you seeing this problem in?

CWSpear commented 9 years ago

@Hortt You can't just paste arbitrary markup in here if you're trying to show the code. I fixed it this time, but it may be a good idea to familiarize yourself with Mastering Markdown

Hortt commented 9 years ago

@CWSpear, Ah, thank you! @jmartin84 Windows Chrome v46.0.2490.80 m

lllopo commented 8 years ago

I also get the same when an empty DIV is added. The div has size and abckground image, but no content and this makes the menu not triggering. I guess this is because you assume the dropdown link can't have hoverable children, but that's not the case in most of the cases, when you decorate a menu with images for example.

lllopo commented 8 years ago

Changing line 50 to : if(!$parent.hasClass('open') && !$this.is(event.target) && !$.contains($this[0], event.target)) {

solved it for me, but not sure if it won't caause other issues. Needs a check by someone more into this.