2011-11-15 14 views
8

Próbowałem dynamicznie włączać/wyłączać współczynniki proporcji w JQueryUI, jednak nawet po ustawieniu opcji na false, zachowuje ona proporcje. Poniżej znajduje się kod Obecnie pracuję z:Nie można zastosować JqueryUI Resizable AspectRatio po inicjalizacji?

$('#aspect_check').click(function() { 
    var ischecked = $('#aspect_check').prop('checked'); 
    if (ischecked) { 
    $("#resizable").resizable("option", "aspectRatio", .75); 
    } else { 
     $("#resizable").resizable("option", "aspectRatio", false); 
    } 
}); 

znalazłem raport o błędzie od 3 lat temu, który wygląda, jakby nadal nie został rozwiązany pomimo oznakowanie to krytyczna. http://bugs.jqueryui.com/ticket/4186

Obejścia nie działają z najnowszymi wersjami. Jakieś pomysły?

Edycja: Po przejściu przez wiele raportów o błędach, o to obejść:

$(function() { 
$.extend($.ui.resizable.prototype, (function (orig) { 
    return { 
     _mouseStart: function (event) { 
      this._aspectRatio = !!(this.options.aspectRatio); 
      return(orig.call(this, event)); 
     } 
    }; 
})($.ui.resizable.prototype["_mouseStart"])); 
}); 

Wklej go w sekcji skryptu JavaScript. Mam nadzieję, że pomaga komuś z podobnym problemem!

+0

edytować swoje prace! Dzięki – willDaBeast

+0

Obejście działa tylko z pozytywnym 'originalPosition'. Każdy pomysł, jak sprawić, by działał również z wartością ujemną? – Core972

Odpowiedz

1

Nie wiem, czy to zadziała, czy co się stanie. Ale możesz spróbować czegoś takiego.

$(function(){ 
    var settings = { 
     aspectRatio : .75 
    }; 
    $("#tadaa").resizable(settings); 

    $("input").change(function(){ 
     if($(this).is(":checked")) 
     { 

      $("#tadaa").resizable("destroy"); 
      $("#tadaa").resizable(); 
     } 
     else 
     { 
      $("#tadaa").resizable("destroy"); 
      $("#tadaa").resizable(settings); 
     } 
    }); 
}); 

żywo demo, obecnie tylko dolna przeciągany element jest zaprojektowany tak, aby wykorzystywać poziome div nie jest stylizowany.

http://jsfiddle.net/t6xFN/1/

+0

Dzięki za odpowiedź @Niels, przykład wygląda na to, że nie działa on tak :(To pokazuje ten sam efekt ręcznego ustawienia, ale po przeczytaniu kilku godzin raportu o błędzie, w końcu znalazłem inny sposób obejścia. oryginalne pytanie z tym dla innych w tym samym bucie. Jeszcze raz! – Alvin

2

Zdaję sobie sprawę, że jest to stary post, ale w przypadku gdy ktoś jeszcze potrzebuje odpowiedzi można zrobić to tak:

$('#aspect_check').click(function() { 
    var ischecked = $('#aspect_check').prop('checked'); 
    if (ischecked) { 
     $("#resizable").resizable({aspectRatio : .75}); 
    } else { 
     $("#resizable").resizable(); 
    } 
}); 
0

Innym rozwiązaniem jest, aby zapisać opcje skalowalne w zmiennej i niszczyć i ponownie zainicjować widżet ze zaktualizowanymi opcji:

var options = $("#resizable").resizable("options"); 
if (ischecked) { 
    options.aspectRatio = .75; 
} else { 
    options.aspectRatio = false; 
} 
$("#resizable").resizable("destroy"); 
$("#resizable").resizable(options); 
10

ten pracował dla mnie bez łatania

$('#resizable') 
    .resizable('option', 'aspectRatio', false) 
    .data('uiResizable')._aspectRatio = false; 

Ta część .data('uiResizable')._aspectRatio = false; przychodzi na ratunek

+1

Doskonały hack, to mnie z problemu! – Erick

Powiązane problemy