📜  jQuery UI 工具提示隐藏选项

📅  最后修改于: 2021-11-24 05:37:55             🧑  作者: Mango

jQuery UI 由使用 jQuery、CSS 和 HTML 实现的 GUI 小部件、视觉效果和主题组成。 jQuery UI 非常适合为网页构建 UI 界面。 jQuery UI 工具提示小部件帮助我们添加新主题并允许自定义。在这篇文章中,我们将看到如何使用隐藏 jQuery UI 工具提示中的选项。隐藏  option 用于在隐藏在工具提示中时添加动画效果。默认情况下,该值为True。

句法:

$( ".selector" ).tooltips(
   { hide : true }
);

参数:

  • Boolean:如果设置为false,则没有隐藏效果。
  • 数字:工具提示隐藏的时间(毫秒)。
  • 字符串:字符串用于选择隐藏工具提示的效果。该效果将用于使用默认持续时间和缓动进行隐藏。
  • 对象:使用对象作为隐藏工具提示,其中提供了效果、缓动、持续时间延迟属性。

方法:

  • 首先,添加项目所需的 jQuery UI 脚本。

示例 1:以下示例演示了工具提示的布尔类型的隐藏选项。

HTML


   

    
    
    
       
    
   
    

        GeeksforGeeks     

            

        jQuery UI | Tooltip hide Boolean option     

               

    Tooltips     GeeksforGeeks is a computer science portal

           


HTML


   

    
    
   
    
   
    
   
    

        GeeksforGeeks     

            

        jQuery UI | Tooltip hide option     

                                

        Click here!     

     


HTML


   

    
    
    
       
    
   
    

        GeeksforGeeks     

            

        jQuery UI | Tooltip hide SlideUp option     

                                

        Click here!     

      


输出:

工具提示隐藏

单击工具提示链接后,我们将获得以下工具提示作为输出。

This is a tooltip

示例 2:以下示例演示了具有 400 毫秒时间的爆炸动画效果的工具提示的隐藏。此处显示了使用expand as String 和 400ms as Number选项。

HTML



   

    
    
   
    
   
    
   
    

        GeeksforGeeks     

            

        jQuery UI | Tooltip hide option     

                                

        Click here!     

       

输出:

示例 3:下面的示例演示了在200毫秒的时间内使用slideUp选项隐藏动画。

HTML



   

    
    
    
       
    
   
    

        GeeksforGeeks     

            

        jQuery UI | Tooltip hide SlideUp option     

                                

        Click here!     

                   

输出:

参考: https : //api.jqueryui.com/category/widgets/