Widget de ventana EasyUI jQuery

En este artículo, aprenderemos cómo diseñar una ventana usando jQuery EasyUI. El widget de ventana es EasyUI es un marco HTML5 para usar componentes de interfaz de usuario basados ​​en tecnologías jQuery, React, Angular y Vue. Ayuda a crear funciones para aplicaciones móviles y web interactivas, lo que ahorra mucho tiempo a los desarrolladores.

Descargas para EasyUI para jQuery:

https://www.jeasyui.com/download/index.php

Sintaxis:

<input class="easyui-window">

Propiedades:

    Métodos:

      Enlace CDN: Primero, agregue los scripts jQuery Easy UI necesarios para su proyecto.

      <script type=”text/javascript” src=”jquery.min.js”> </script>  
      <!–Bibliotecas jQuery de EasyUI –>
      <script type=”text/javascript” src=”jquery.easyui.min. js”> </script>  
      <!–Biblioteca jQuery de EasyUI Mobile –>
      <script type=”text/javascript” src=”jquery.easyui.mobile.js”> </script> 

      Ejemplo:

      HTML

      <html> 
      <head>             
          <!-- EasyUI specific stylesheets-->
          <link rel="stylesheet" type="text/css"
                href="themes/metro/easyui.css"> 
        
          <link rel="stylesheet" type="text/css"
                href="themes/mobile.css"> 
        
          <link rel="stylesheet" type="text/css"
                href="themes/icon.css"> 
        
          <!--jQuery library -->
          <script type="text/javascript"
                  src="jquery.min.js"> 
          </script> 
        
          <!--jQuery libraries of EasyUI -->
          <script type="text/javascript"
              src="jquery.easyui.min.js"> 
          </script> 
            
          <!--jQuery library of EasyUI Mobile -->
          <script type="text/javascript"
              src="jquery.easyui.mobile.js"> 
          </script> 
        
            
          <script type="text/javascript">
              $(document).ready(function (){ 
                  $('#gfg').window({ 
                      title: 'GfG',
                      resizable: true
                  }); 
            }); 
          </script> 
      </head> 
      <body>
          <h1>GeeksforGeeks</h1>
          <h3>EasyUI jQuery window widget</h3>
          
         <!-- Create the easyUI window -->
         <input id="gfg" class="easyui-window">
      </body>
      </html>
      

      Producción:

       

      Referencia: https://www.jeasyui.com/documentation/window.php

      Publicación traducida automáticamente

      Artículo escrito por taran910 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

      Deja una respuesta

      Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *