2012-05-19 10 views
6

No puedo lograr que se configuren las opciones del plugin jquery-layout. El valor predeterminado se representa correctamente, pero las opciones no. Intento configurar el tamaño y el desplazamiento en el documento listo, pero cuando estoy alerta para el cambio de tamaño, devuelve falso. ¿Alguien puede detectar lo que está mal aquí?Jquery diseño redimensionable no funciona

JS:

$(document).ready(function() { 
var myLayout = $('body').layout({ 
    west: { 
    resizable: true, 
    resizeWhileDragging: true, 
    slidable:    true 
    } 

}); 
alert(myLayout.options.west.resizable); //returns false 
}); 

html:

<body> 

<div class="ui-layout-center">Center 
    <div id="board">   
    </div> 
    <button onclick="set_board();">New Game!</button> 
    <button onclick="execute_turn();">Turn!</button> 
</div> 
<div class="ui-layout-east">East</div> 
<div class="ui-layout-west">West</div> 
</body> 
+0

Hiya hombre - Qué quiere decir plugin de diseño? http://layout.jquery-dev.net/documentation.cfm; No estoy seguro de si Jquery tiene la API '.layout', por favor avíseme, podría ayudarlo, ovaciones –

+0

ups, sí, el complemento de diseño – valen

+0

Cooleos, ¿es esto lo que está buscando? ** demostración en funcionamiento ** http://jsfiddle.net/wy69R/4/ por favor avíseme si esta ayuda, voy a configurarlo como respuesta, –

Respuesta

0

Estás inicializar el plugin de diseño doble ... tratar conslidating la definición y la inicialización opciones myLayout:

$(document).ready(function() { 
var myLayout = $('body').layout({ 
    west: { 
    resizable: true, 
    resizeWhileDragging: true, 
    slidable:    true 
    } 

}); 
alert(myLayout.options.west.resizable); //returns false 
}); 
+1

intenté ... no hay diferencia :( – valen

13

Se funciona para mí cuando jqueryui está incluido también, como en t El demo simple de jquery-layout en http://layout.jquery-dev.net/demos/simple.html.

Asegúrese de incluir primero jquery-ui, y luego jquery.layout, de lo contrario, no funcionará.

Ejemplo:

<script src="lib/jquery/jquery-ui-1.10.4.js"></script> 
<script src="lib/jquery/jquery.layout-1.3.0-rc30.79.js"></script> 
+2

Esta es la respuesta correcta. Tuve un dolor de cabeza con esto, hasta que me di cuenta de que incluí los dos en el orden incorrecto. – Domi

+1

Gracias por esto. Resolvió mi problema. Creo que sería bueno para los desarrolladores de este complemento proporcionar un ejemplo simple 'simple' que es simple, es decir, diseño mínimo de múltiples paneles con paneles redimensionables, pero sin todos los botones/botones adicionales/eventos en línea, etc. Ese sería el ejemplo más comúnmente requerido. No hay problema con tener la versión 'hinchado/botones' - pero tal vez darle un nombre diferente. – Manachi

+0

+1 + es bueno tener imporovement para esta respuesta correcta. Mencione también el jquery, por lo tanto, el orden correcto para la carga de libs es jquery, jquery-ui, jquery-layout –