See the handles option. For a resize handle on the left side, you can either set
handles:'all' or handles:'w' http://docs.jquery.com/UI/Resizable#option-handles - Richard On Thu, Mar 5, 2009 at 7:51 AM, sure <sure.2...@gmail.com> wrote: > Hi Richards, > Now i am able to get and set the data for maxWidth > or any using with latest library version i.6rc6. I read the > documentation here http://jqueryui.com/docs/Developer_Guide. But > finally i have a small doubt in resize option. is it possible to > resize the div left side also like dialog window. If is it so, how can > i do this. > > //setter > $('#liquidlayout').resizable("option","maxWidth",500); > //getter > var maxWidth = $('#liquidlayout').resizable("option","maxWidth"); > > with Regards > sure > On Mar 5, 5:10 pm, sure <sure.2...@gmail.com> wrote: > > Hi Richards, > > I would like to use new Jquery-1.6rc6 library. > > Than how can i do this, i mean getter and setter for resize option. > > with Regards > > sure > > > > On Mar 5, 5:01 pm, sure <sure.2...@gmail.com> wrote: > > > > > Hi Richard, > > > Thanks for your quick response. I have tried by all > > > means to get and set the maxWidth as you said. But still it returns > > > noting (undefined). I had tried with both jquery ui 1.5.3 and 1.6rc6. > > > Please tell me where should i make the changes in my code. This is a > > > great plug in, there is no doubt about it. I know it is very simple > > > problem for any one. But, i don't know where should i did the mistake. > > > I am request you,Please fix my code and post it. I think it is the > > > stright solution for this. Here is paste my code. > > > > > <code> > > > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " > http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> > > > <html xmlns="http://www.w3.org/1999/xhtml";> > > > <head> > > > <meta http-equiv="Content-Type" content="text/html; > > > charset=iso-8859-1" /> > > > <title>Liquid-Layout</title> > > > <style type="text/css"> > > > body > > > { > > > margin:0; > > > padding:5px; > > > width:100%; > > > background:#FFFFFF; > > > } > > > .liquidlayout > > > { > > > position:relative; > > > clear:both; > > > float:left; > > > background:#FFFFFF; > > > border:2px #CCCCCC dotted; > > > width:800px; > > > } > > > .topcls > > > { > > > float:left; > > > position:relative; > > > width:100%; > > > background:#FFFFFF; > > > color:#000000; > > > } > > > .topcls-row > > > { > > > float:left; > > > width:74%; > > > position:relative; > > > background:#FFFFFF; > > > border:1px #CCCCCC solid; > > > margin:1px; > > > /*min-height:180px;*/ > > > } > > > .toprightcolum > > > { > > > float:right; > > > top:0; > > > right:0; > > > position:relative; > > > background:#FFFFFF; > > > border:1px #CCCCCC solid; > > > width:25%; > > > overflow:hidden; > > > min-height:45px; > > > } > > > .bottomcls > > > { > > > clear:both; > > > float:left; > > > position:relative; > > > width:100%; > > > background:#FFFFFF; > > > color:#003366; > > > } > > > .btmcls > > > { > > > float:left; > > > position:relative; > > > width:32.5%; > > > background:#FFFFFF; > > > text-align:center; > > > border:1px #CCCCCC solid; > > > margin:2px; > > > } > > > .gargetcls > > > { > > > font-family:Arial; > > > font-size:12px; > > > background:#FFCC00; > > > color:#FF0000; > > > border:1px #FF9900 solid; > > > position:relative; > > > width:130px; > > > left:35px; > > > top:25px; > > > } > > > #customblock > > > { > > > position:relative; > > > float:left; > > > background:#EEEEEE; > > > border:1px #666666 solid; > > > margin-top:2px; > > > } > > > #tooltip > > > { > > > font-family:Arial; > > > font-size:10px; > > > background:#333333; > > > color:#FF9900; > > > position:absolute; > > > padding:5px; > > > z-index:10242; > > > } > > > </style> > > > <link rel="stylesheet" href="css/flora.resizable.css" /> > > > <script src="js/jquery-1.2.6.js" type="text/javascript"></script> > > > <script src="js/jquery-ui-personalized-1.5.3.min.js" type="text/ > > > javascript"></script> > > > <!--<script src="js/jquery-1.3.1.min.js" type="text/javascript"></ > > > script> > > > <script src="js/jquery-ui-personalized-1.6rc6.min.js" type="text/ > > > javascript"></script>--> > > > <script type="text/javascript"> > > > $(function() > > > { > > > $("#liquidlayout,#liquidlayout > div").mousemove(function(e) > > > { > > > var x = parseInt(e.pageX)+10; > > > var y = parseInt(e.pageY)+10; > > > $("#tooltip").css("left",x+"px"); > > > $("#tooltip").css("top",y+"px"); > > > }); > > > init(); > > > var rWid = > (parseInt($("#mWidth").val())-parseInt($("#trcolum").val > > > ()))-7; > > > $(".liquidlayout").resizable( > > > { > > > > autoHide:true,ghost:true,resize:function(ev,ui) > > > { > > > > $("#tooltip").show("slow").html(ui.size.width > > > +"X"+ui.size.height); > > > > $("#tlrows").attr("value",$(".topcls-row").css("width")); > > > > $("#mWidth").attr("value",ui.size.width); > > > //init(); > > > > //$("#debug").html(maxWid); > > > }, > > > stop:function(ev,ui) > > > { > > > > $("#tooltip").hide("slow"); > > > var maxWidth = > $('.liquidlayout').data('maxWidth.resizable'); > > > alert(maxWidth); > > > > > } > > > }); > > > $(".topcls-row").resizable( > > > { > > > > alsoResize:".topcls-row",autoHide:true,resize:function(ev,ui) > > > { > > > > $("#tooltip").show("slow").html(ui.size.width > > > +"X"+ui.size.height); > > > > $("#tlrows").attr("value",ui.size.width); > > > }, > > > stop:function(ev,ui) > > > { > > > > $("#tooltip").hide("slow"); > > > } > > > > > }); > > > > $(".toprightcolum").resizable({autoHide:true,containment:$ > > > ("#liquidlayout").length?'#liquidlayout':'document'}); > > > $(".btmcls").resizable > > > ({autoHide:true,alsoResize:"#btmcol1,#btmcol2,#btmcol3"}); > > > }); > > > function init() > > > { > > > var Wid = > (parseInt($("#mWidth").val())-parseInt($("#trcolum").val > > > ()))-7; > > > $("#maxWidth").attr("value",Wid); > > > > $("#mWidth").attr("value",$("#liquidlayout").css("width")); > > > > $("#tlrows").attr("value",$(".topcls-row").css("width")); > > > > $("#trcolum").attr("value",$(".toprightcolum").css("width")); > > > } > > > > > </script> > > > </head> > > > <body> > > > <div id="liquidlayout" class="liquidlayout"> > > > <div id="topcls" class="topcls"> > > > <div id="toprightcolum" > class="toprightcolum">Click to insert > > > gadget</div> > > > <div id="toprow1" > class="topcls-row">Click to insert gadget</div> > > > <div id="toprow2" > class="topcls-row">Click to insert > > > > ... > > > > read more ยป > > > --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "jQuery UI" group. To post to this group, send email to jquery-ui@googlegroups.com To unsubscribe from this group, send email to jquery-ui+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/jquery-ui?hl=en -~----------~----~----~----~------~----~------~--~---
