jQuery Mobile 工具栏位置选项

jQuery Mobile 是一种基于 Web 的技术，用于创建网站和应用程序，这些网站和应用程序在各种屏幕尺寸的设备（如移动设备、平板电脑和台式机）上具有响应性和可访问性。

在本文中，我们将使用 jQuery Mobile 工具栏位置选项。当位置选项设置为“固定”时，工具栏使用 CSS 属性“位置：固定”浮动在内容上方。

句法：

使用指定位置选项初始化工具栏：

$( ".selector" ).toolbar({
  position: "fixed"
});

初始化后获取或设置位置选项：

// Getter
var position = $( ".selector" ).toolbar( "option", "position" );
 
// Setter
$( ".selector" ).toolbar( "option", "position", "fixed" );

CDN 链接：首先，添加项目所需的 jQuery Mobile 脚本。

示例：在此示例中，我们将位置选项设置为“固定”，因此工具栏将浮动在内容上方。

HTML

 

    
    
    
    
    
    
    
    
 
    
        $(document).ready(function () {
            $("#divID").toolbar({
                position: "fixed",
            });
        });
    

 

    
        
            
                GeeksforGeeks
            
            jQuery Mobile Toolbar position option
             
            What is GeekforGeeks?
            
                GeeksforGeeks is a computer science portal
                for geeks by geeks. Here you can find
                articles on various computer science topics
                like Data Structures, Algorithms and many
                more.... GeekforGeeks was founded by Sandeep
                Jain in 2009. GeeksforGeeks also provide
                courses, you can find the courses at
                
                    https://practice.geeksforgeeks.org/courses
                 For cracking interviews of top product
                based companies, you need to have good and
                deep understanding of topics like DSA, System
                design etc. GeeksforGeeks provide you quality
                content so that you can prepare for the
                interviews. GeeksforGeeks also have a practice
                portal where you can practice problems and
                brush on your skills. You can visit the
                practice portal at
                
                    https://practice.geeksforgeeks.org
            
 
 
        
        
            Toolbar
        
    

 

输出：

浮动在其他内容之上的工具栏

参考： https://api.jquerymobile.com/toolbar/#option-position