動態調整大小DIV jQuery的

-1

var toprint= "<div id='any' class ="resizable sort">content</div> <div id='any2' class ="resizable darg">content</div> ";

然後添加到頁面使用此代碼

$(ui.item).html(toprint);

它是可排序的唯一不可調整大小的太

$('.sort').sortable({ 
    handle:'.widget-head', 
    connectWith: ".sort", 
    out: function (e,ui) { 
     $(".sort").children().resizable({ 
      axis: 'x', 
      containment: 'parent', 
      resize: function(event, ui) { 
       ui.size.width = ui.originalSize.width; 
       (ui.helper).css({'position': '', 'top': '0px'}); 
      } 
     }); 
    } 
});

來源

2011-09-22 Jehad Ahmad Jaghoub

試試這個可能有用。

$('.sort').live('click', function() { 
    $(function() { 
     $('.sort).children().resizable({ 
      axis: 'x', 
      containment: 'parent', 
      resize: function(event, ui) { 
       ui.size.width = ui.originalSize.width; 
       (ui.helper).css({'position': '', 'top': '0px'}); 
      }); 
     }); 
    }); 
});

來源

2013-04-09 08:45:52 Coderx07

它的工作現在只需要直播功能:)

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>jQuery UI Resizable - Maximum/minimum size</title> 
    <link rel="stylesheet" href="http://jqueryui.com/themes/base/jquery.ui.all.css"> 
    <script src="js/jquery.min.js"></script> 
    <script src="js/jquery-ui-1.8.13.custom.min.js"></script> 

    <style> 
    #resizable { width: 440px; height: 150px; padding: 5px; border-right:5px #3C0 solid; } 

    </style> 

    <style type="text/css"> 
.tableres 
{ 
border-collapse:collapse; 
} 
.tableres, td, th 
{ 
border:1px solid black; 
} 
.ul1 { 


} 
</style> 

    <script> 


    $('.ul1').live('click', function() { 
    // Bound handler called. 



    $(function() { 
     $(".ui-widget-content").resizable({ 

      maxWidth: 780, 
      minWidth: 100 
     }); 
    }); 

    }); 

    </script> 
</head> 
<body> 

<div class="demo"> 

<table class="tableres" width="880px" cellspacing="0" cellpadding="0"> 
    <tr> 
    <td width="10%" align="center" valign="top"><div id="resizable" class="ui-widget-content ul1"></div></td> 
    <td width="90%" align="center" valign="top"><div class="ul1" >make me resize</div></td> 

    </tr> 
</table> 


</div><!-- End demo --> 




</body> 
</html>

來源

2011-09-23 01:22:22

動態調整大小DIV jQuery的

回答

相關問題