How can I hold Twitter Bootstrap Popover open until my mouse moves into it?

前端 未结 16 1387
野性不改
野性不改 2020-12-04 05:55

I have a link that uses the Twitter Bootstrap Popover version 1.3.0 to show some information. This information includes a link, but every-time I move my mouse from the link

16条回答
  •  小蘑菇
    小蘑菇 (楼主)
    2020-12-04 06:41

    Here is what i did:

    e = $("a[rel=popover]")
    e.popover({
        content: d, 
        html:true, 
        trigger:'hover',
        delay: {hide: 500},
        placement: 'bottom',
        container: e, 
    })
    

    This is a very simple and awesone solution to this probelm, which i found out by looking into the bootstrap tooltip code. In Bootstrap v3.0.3 here is the line of code i noticed:

    this.options.container ? $tip.appendTo(this.options.container) : $tip.insertAfter(this.$element)
    

    this says that if container property of popover is defined then the popover gets appendTo() the element instead of insertAfter() the original element, all you need to do is just pass the element as container property. Because of appendTo() the popover becomes part of the link on which the hover event was binded and thus keeps the popover open when mouse moves on it.

提交回复
热议问题