jQuery EasyUI Extensión -Portal (para crear gráficos, listas, gráficos esféricos, etc.)
jQuery EasyUI Extensión
Uso
Paso 1: Crear una página HTML
<div id="pp" style="width:800px;height:500px;"> <div style="width:33%"></div> <div style="width:33%"></div> <div style="width:33%"></div> </div>
Paso 2: Crear el Portal
$('#pp').portal(options);
Paso 3: Agregar widgets de panel al Portal
// create the panel
var p = $('<div></div>').appendTo('body');
p.panel({
title: 'My Title',
height:150,
closable: true,
collapsible: true
});
// add the panel to portal
$('#pp').portal('add', {
panel: p,
columnIndex: 0
});
Propiedades
| Nombre | Tipo | Descripción | Valor predeterminado |
|---|---|---|---|
| width | number | El ancho del portal. | auto |
| height | number | El alto del portal. | auto |
| border | boolean | Define si se muestra el borde del portal. | false |
| fit | boolean | Cuando se establece en true, ajusta el tamaño del portal para adaptarse a su contenedor padre. | false |
Eventos
| Nombre | Parámetros | Descripción |
|---|---|---|
| onStateChange | none | Se activa cuando el usuario arrastra y suelta un panel. |
| onResize | width,height | Se activa cuando cambia el tamaño del portal. |
Métodos
| Nombre | Parámetros | Descripción |
|---|---|---|
| options | none | Devuelve el objeto de opciones. |
| resize | param | Establece el tamaño del portal; el parámetro 'param' incluye las siguientes propiedades: width: el nuevo ancho del portal. height: el nuevo alto del portal. |
| getPanels | columnIndex | Obtiene el panel de la columna especificada; si el parámetro columnIndex no está asignado, devuelve todos los paneles. |
| add | param | Agrega un nuevo panel; el parámetro 'param' incluye las siguientes propiedades: panel: el objeto panel que se va a agregar. columnIndex: el índice de la columna en la que se insertará. |
| remove | panel | Elimina y destruye el panel especificado. |
| disableDragging | panel | Deshabilita la función de arrastrar y soltar del panel. |
| enableDragging | panel | Habilita la función de arrastrar y soltar del panel. |
Descargar ejemplos de jQuery EasyUI
jquery-easyui-portal.zip
jQuery EasyUI Extensión Otras extensiones