📌  相关文章
📜  如何使用 Sidetap 插件为移动设备设计侧边导航？

📅  最后修改于: 2021-11-07 09:15:10             🧑  作者: Mango

在本文中，我们将学习如何使用Sidetap插件为移动 Web 界面设计侧边导航功能。这个插件是一个非常轻量级和平台独立的框架，并提供易于使用的语法和灵活性。它完全基于 HTML、JavaScript 和 CSS。

请从链接下载所需的预编译文件并将其保存在您的工作文件夹中以供实施。请注意正确的文件路径，同时包含在您的源代码中。

方法：

  1. 创建 HTML 结构： Sidetap插件使用非常具体的 HTML 结构，其中包含 head 部分中的所有预编译库，如下面的最终代码所示。插件特定的类与 HTML“div”一起使用，导航面板class=”stp-nav”和 content 面板class=”stp-content-panel” 。用于主体内容的类是 class=”stp-content-body” 。
  2. 实例化 Sidetap：在您的移动 Web 应用程序中，以下语法用于创建对 Sidetap 的引用。这是在 HTML 代码的脚本部分编写的。 

    var my_variable = new sidetap();

最终代码： 



  

    
    
  
    
    
    
    

  

    

        

            

                
                
            

        

  
        

  
            
            

  
                
                

                    
                        Menu
                    
 Sidetap Plugin

                

  
                

                    

                        

                            
Body content.

                        

                    

                

            

            
        

    

  
    
    
  
    
    
  
    

  

输出：