Блог

скопирован следующий код из http://jqueryui.com/demos/resizable/#default

 <meta charset="utf-8">
<style>#resizable { width: 150px; height: 150px; padding: 0.5em; }
#resizable h3 { text-align: center; margin: 0; }
</style>
<script>
$(function() {
$( "#resizable" ).resizable();
});
</script>
<div class="demo">
<div id="resizable" class="ui-widget-content">
    <h3 class="ui-widget-header">Resizable</h3>
</div>
</div>  

Он выводит это.


Я хочу зафиксировать событие двойного щелчка для каждой позиции курсора, чтобы, если

1. Дважды щелкнув горизонтальным курсором изменения размера, я могу переключать ширину текущего изменяемого размера между исходной и максимально доступной шириной.
2. Дважды щелкните вертикальным курсором изменения размера, я могу переключать высоту текущего изменяемого размера между исходной и максимально доступной высотой.
3. Дважды щелкнув курсором изменения размера по диагонали, я могу переключать ширину и высоту текущего изменяемого размера между исходной и максимально доступной шириной и высотой.

Обработчики имеют определенные имена классов:

 ui-resizable-se//bottom right
ui-resizable-s//bottom
ui-resizable-e//right
  

Вы можете выбрать их и привязать dblclick:

 $('.ui-resizable-se').dblclick(function(){alert('clicked bottom right handle');})
  

Указатель на изменяемый размер вы получите внутри функции, используя $(this).parent()

Используйте firebug, чтобы найти элементы, которые вы хотите прикрепить к событию (например: .ui-resizable-e — self explainable) и использовать, например:

$(".ui-resizable-e").dblclick(myFunctionToResize);

Это то, что вы имеете в виду?