Problème avec jQuery redimensionnable à l'intérieur de iframe

Question

J'ai une première page. Où est un lien qui ouvre jQuery Dialog avec iframe avec la deuxième page à l'intérieur. Il y a une zone de texte redimensionnable à l'intérieur de la deuxième page. En fait, la zone de texte n'est redimensionnable que lorsque j'ouvre la deuxième page strictement sans iframe, mais elle n'est pas redimensionnable à l'intérieur de iframe. Comment peut-il être réparé?

UPD: Ceci est mon code html de la première page:

1. <div id="dialog-system" title="system settings">
2.   <div class="loadingDivForDialog"><img src="Control/Image/loading.gif" alt="loading..." /></div>
3.   <iframe id="SystemFrame" src="" scrolling="no" frameborder="0"></iframe>
4. </div>

* This source code was highlighted with Source Code Highlighter .

c'est le script à la boîte de dialogue opent:

1. function showSystemDialog(propertyName, id_prov, psysName, currentItemForTick) {
2.   $('.loadingDivForDialog').show();
3.   $('#SystemFrame').hide();
4.  
5.   var defaultSrc = "Settings.aspx?pro=" + propertyName + "&id_prov=" + id_prov;
6.   $("#systemFrame").attr('src', String(defaultSrc));
7.  
8.   $("#dialog-system").dialog({
9.     resizable: false,
10.     height: 300,
11.     width: 680,
12.     modal: true,
13.     position: 'center',
14.     buttons: {}
15.   });
16.   $('#SystemFrame').load(function() {
17.     $('.loadingDivForDialog').hide();
18.     $('#SystemFrame').show();
19.     $('#SystemFrame').contents().find("input[value='Update']").click(function() {
20.  
21.       var obj = $("#" + currentItemForTick);
22.  
23.       if (obj.get(0).tagName == "INPUT") {
24.         obj.attr('checked', true);
25.       }
26.       else {
27.         obj = window.parent.$("input[value='" + psysName + "']");
28.  
29.         obj.attr("checked", true);
30.       }
31.     });
32.  
33.     $('#SystemFrame').contents().find("input[value='Cancel']").click(function() { $("#dialog-system").dialog("close") });
34.  
35.     $("#dialog-system").dialog("option", "height", parseInt($('#SystemFrame').contents().height(), 10) + 35);
36.   });
37.   return false;
38. }

* This source code was highlighted with Source Code Highlighter .

c'est textarea et l'écriture de la deuxième page:

1. <textarea name="ctl00$ContentPlaceHolderBody$ctrl02$fldText" rows="2" cols="20" id="ctl00_ContentPlaceHolderBody_ctrl02_fldText" class="textbox"></textarea>
2.  
3. <script type="text/javascript">$(function() {
4.   $("#ctl00$ContentPlaceHolderBody$ctrl02$fldText").resizable({
5.     handles: "se",
6.     maxWidth: 340,
7.     minWidth: 196,
8.     minHeight: 18
9.   });
10. });</script>

* This source code was highlighted with Source Code Highlighter .

UPD: Des idées?

Answer 1

J'ai un problème similaire avec le redimensionnement quand il y a des iframes sur la page. Je commence à arriver à la conclusion que l'iframe empêche les gestionnaires de souris concernés de passer à la logique de redimensionnement dans jQuery.

Pas strictement une solution, mais il pourrait pointer quelqu'un dans la bonne direction.

MISE À JOUR: Voir le dernier commentaire sur ce billet jQuery pour plus de détails d'un correctif potentiel http://bugs.jqueryui.com/ticket/3176