Форум

Veterinar · #1 (**permalink**) 10.05.2014, 13:05

Подскажите, пожалуйста.
Для элемента задано свойство Resizable, установлены его параметры, но при установке шага изменения, на страничке элемент меняет размеры без учета ограничения шага:

$('#run_resise').resizable({
	grid: [32,16],
	minHeight: 16,
	minWidth: 32
});

Причем ограничения на минимальные размеры работают.

Спасибо

jsnb · #2 (**permalink**) 10.05.2014, 13:25

Приводите конкретный пример и браузер. Например, если сделать так, то всё работает.

Veterinar · #3 (**permalink**) 10.05.2014, 13:30

jsnb, действительно работает.
В этом же браузере! Зараза! )))

вот тут не хочет: http://ledagregator.ru/
Надо таскать за границы дурацкой картинки (чёренькая такая).

jsnb · #4 (**permalink**) 10.05.2014, 13:33

Сообщение от Veterinar

вот тут не хочет: http://ledagregator.ru/
Надо таскать за границы дурацкой картинки (чёренькая такая).

Так в каком браузере не пашет то? В последних FF и хроме вроде норм.

Veterinar · #5 (**permalink**) 10.05.2014, 13:39

jsnb, дык похоже проблема в другом. На глаз вроде бы оно скочет с учетом шага, но когда передаю значение resize в поле формы (на той же страничке поля над этой картинкой), то при умножении в форму передается какая-то хренатень:

$('#run_resise').resizable({
	grid: [32,16],
	minWidth: 32,
	minHeight: 16,
	stop: function(event, ui) {
		$('#order_width').val(parseInt(ui.size.width)*10);
		$('#order_height').val(parseInt(ui.size.height)*10);
	}
});

Во всяком случает контроль данных в форме сразу матерится:

<input type="number" name="order_width" id="order_width" size="7" min="320" max="100000" step="320" />

jsnb · #6 (**permalink**) 10.05.2014, 13:46

Вместо ui.size.height/ui.size.width юзайте ui.helper.height()/ui.helper.width()

рони · #7 (**permalink**) 10.05.2014, 13:53

Veterinar,

<!doctype html>
<html>
<head>
	<meta charset="utf-8">
	<title>Resizable</title>
	<link type="text/css" rel="stylesheet" href="http://sven-soft.com/css/ui-lightness/jquery-ui-1.10.3.custom.min.css">
	<style type="text/css">
		*{
			margin:0;
			padding:0;
		}
		#run_resise{
			position:absolute;
			top:40px;
			height:16px;
			width:32px;
		   	background:#ccf;
		}

	</style>
	<script type="text/javascript" src="http://sven-soft.com/js/jquery-1.9.1.js"></script>
	<script type="text/javascript" src="http://sven-soft.com/js/jquery-ui-1.10.3.custom.min.js"></script>
	<script type="text/javascript">
  		$(function () {
		    $('#run_resise').resizable({
		        grid: [32, 16],
		        minWidth: 32,
		        minHeight: 16,
		        stop: function (event, ui) {
		            $('#order_width').val(ui.size.width * 10);
		            $('#order_height').val(ui.size.height * 10);
		        }
		    });
		});
	</script>
</head>
<body>
    <input type="number" name="order_width" id="order_width" size="7" min="320" max="100000" step="320" value="320"/>
    <input type="number" name="order_height" id="order_height" size="7" min="160" max="100000" step="160" value="160"/>
	<div id="run_resise" ></div>
</body>
</html>

Veterinar · #8 (**permalink**) 10.05.2014, 13:59

рони, не зря "профессор"!

Но тока я так нихрена не понял - отчего у вас работает, а у меня кажет какую-то дурь?

jsnb · #9 (**permalink**) 10.05.2014, 14:01

Сообщение от Veterinar

Но тока я так нихрена не понял - отчего у вас работает, а у меня кажет какую-то дурь?

Я ж сказал, что на что заменить.

Veterinar · #10 (**permalink**) 10.05.2014, 14:05

рони, подскажите, может ли это быть из-за того, что в изменяемый див я впендюрил картинку?

Форум

Справочник

Discord чат

Курсы javascript