📌  相关文章
📜  如何使 Bootstrap 弹出窗口在悬停而不是单击时出现/消失?

📅  最后修改于: 2021-11-24 04:53:40             🧑  作者: Mango

Bootstrap 为制作弹出框提供了内置支持。弹出框是当用户使用指定的元素选择器触发特定事件时出现的内容框。在这里,我们将讨论使用“悬停”而不是“单击”来触发弹出窗口的方法。

方法1:这里,我们将仅使用jQuery 初始化在’hover’ 中指定popover 触发器。我们可以在popover()函数本身中添加标题详细信息以及触发条件作为参数。

  • 程序:
    
    
    
    
        
        
        
        
    
      
    
        
            
                

    GeeksforGeeks

                                 Bootstrap popover appear/disappear                  on hover instead of click                          

                         
        
           
  • 输出:

方法 2:这里我们将使用 ‘data-trigger’ 属性。我们也可以通过将‘title’‘data-trigger’作为属性而不将它们指定为popover()方法中的参数来实现相同的效果。

  • 程序:
    
    
    
    
          
        
        
        
        
    
      
    
        
            
                

    GeeksforGeeks

                                 Bootstrap popover appear/disappear                  on hover instead of click                          

                         
        
           
  • 输出: