フレームセットのサイズがマウスのサイズ変更後に正しく調整されない

あるフレームに親フレームセットを最小限に抑えるボタンがあるフレームセットがあります。フレームセットのサイズがマウスのサイズ変更後に正しく調整されない

コードは機能しますが、問題は、マウスで手動でフレームのサイズを変更してから最小化ボタンを押すと、IE8とChromeでサイズが正しく変更されない場合です。それはFFで正しくサイズ変更されます。

私は、このHTML構造

... 
<frameset cols="32%,*" border="2" frameborder="1" framespacing="1"> 
    <frameset rows="350,*" border="2" frameborder="1" framespacing="1" id="searchResultFrameset"> 
     <!-- The minimize button are in this frame searchResultFrame --> 
     <frame name="searchResultFrame" scrolling="no" src="dummy"> 
     <frame name="itemFrame" frameborder="1" scrolling="no" id="itemFrame" src="dummy2"></frameset> 
    <frame name="contentFrame" frameborder="0" scrolling="yes" id="contentFrame" src="dummy3"> 
</frameset> 
...

ボタンを押したときに実行されるこのコードを持っています。

// Minimize frame button 
$('.minimizeFrame').toggle(function() { 
    parent.document.getElementsByTagName('frameset')[1].setAttribute('cols','22,*'); 
}, function() { 
    parent.document.getElementsByTagName('frameset')[1].setAttribute('cols','32%,*'); 
});

私は、開発者向けツールでcols="22,*"へのcols="32%,*"変化を見ることができますが、まだそれは間違ったサイズでレンダリングします。

マウスを変更した後、サイズが正しくないのはなぜですか？何か不足しているのですか、それともブラウザのバグですか？または、おそらく、このバグなしでフレームのサイズを変更するための代替ソリューションがありますか？

例

http://jsbin.com/ohihiy/2

出典

2012-12-03 Codler

この問題も発生しています。コラムを設定しても、それはいつもあなたがそれを合計したものではなく、それにリサイズしたものに相対的です。これはSafariがChromeと同じように動作するため、Firefoxが期待どおりに動作するため、Webkitのバグであるようです。 – Joel

フレーム枠を使って手作業でサイズを変更すると表示されますが、フレームをプログラムで正確にサイズ変更する方法はありません。 – Joel

Codlerの例js-codeでは、2番目の（内側の）フレームセットのcols属性が設定されています。私は、外側のフレームセットが設定されていたと推測しています。 – Rembunator

私はあなたが別のフレームでのオブジェクトの属性を設定しようとして正しく理解していれば。一部のブラウザでは対応していません。

私が問題を再現しようとすると、私はFireWireでフレームのサイズを切り替えることができます（問題ありません）。

しかしクロムでは、別のページ、つまりフレーム内のページ内のフレームセットページにプロパティを設定しようとしているため、セキュリティエラーが発生します。

編集：次のコードはIE8で動作します。それはあなたが必要とするものですか？

jqueryの-1.8.2.min.jsファイルを追加することを忘れないでください

ファイル：frame1.html

：

<!doctype html public "-//w3c//dtd html 4.01 frameset//en" 
    "http://www.w3.org/tr/html4/frameset.dtd"> 
<html> 
<head> 
<title>a simple frameset document</title> 
</head> 

<frameset cols="32%,*" border="2" frameborder="1" framespacing="1"> 
    <frameset rows="350,*" border="2" frameborder="1" framespacing="1" id="searchResultFrameset"> 
     <!-- The minimize button are in this frame searchResultFrame --> 
     <frame name="searchResultFrame" scrolling="no" src="frame1.html"> 
     <frame name="itemFrame" frameborder="1" scrolling="no" id="itemFrame" src="dummy2"></frameset> 
    <frame name="contentFrame" frameborder="0" scrolling="yes" id="contentFrame" src="dummy3"> 
</frameset> 

</html>

ファイルindex.htmlを

<html> 
    <head> 
    <script src="jquery-1.8.2.min.js"></script> 

    <script> 

    $(init_page); 

    function init_page() 
     { 
     // Minimize frame button 
     $('#minimizeButton') 
     .toggle(function() 
      { 
      parent.document.getElementsByTagName('frameset')[0].setAttribute('cols','22,*'); 
      }, 
      function() 
      { 
      parent.document.getElementsByTagName('frameset')[0].setAttribute('cols','32%,*'); 
      }); 
     } 

    </script> 
    </head> 
    <body> 
    <button id='minimizeButton'>toggle</button> 
    </body> 
</html>

出典

2013-02-18 09:26:28 Rembunator

私はあなたが理解したとは思わない。任意のウィンドウスコープ（top、frameset、childと同じ）からサイズ変更可能なフレームセットのcolsプロパティを設定しようとしていますが、同じ結果が得られます。フレームプロパティにアクセスする際のセキュリティ上の問題ではなく、マウスでサイズ変更した後のフレームセットのレンダリング方法に問題があります。 – Joel

答えを更新しました。 – Rembunator

驚いたことに、今日IE8でテストしたところ、今日でもChromeではうまく動作しているようですが、 – Codler

Webkitのこのバグのように見えますが、201 0：

https://bugs.webkit.org/show_bug.cgi?id=36584

出典

2013-10-01 17:31:10

私は同じ問題を抱えていた、と私は隠れの提案を使用し、設定した後、再び登場し、それが私のために働きました。たとえば以下を参照してください。

var $frames = $(<parentElement>).find('<framesetname>')[ 0 ]; 
frames.hide().attr('cols', '*,500').show();

彼らはクロームやFirefox、IE11 &オペラのために働きました。あなたのために働くことを願っています。

出典

2016-11-02 20:29:29

フレームセットオブジェクトに対してhide（）関数を呼び出すことはできないようです。コンテナから削除し、属性を設定してからコンテナに再追加する必要があります。 –

これは私のために働いた。私はcolを "リセット"し、 "後で"正しい幅を設定する関数を作成しました。リセット後にタイムアウトする必要があるか、子フレームに「触れる」ループのように見えます。

function init_page() { 
    function setCols(frms, cols) { 
    // for some magic reason we have to 1st -> reset current cols 
    frms.setAttribute('cols', ''); 
    // and 2nd ask about child width (it's now clientWidth) 
    for (var i = 0; i < frms.children.length; ++i) { 
     if (frms.children[i] && (typeof frms.children[i].clientWidth != "undefined" || typeof frms.children[i].width != "undefined")) { 
     } 
    } 
    frms.setAttribute('cols', cols); 
    } 
    // Minimize frame button 
    $('#minimizeButton') 
    .toggle(function() { 
     setCols(parent.document.getElementsByTagName('frameset')[0], '50,*'); 
    }, 
    function() { 
     setCols(parent.document.getElementsByTagName('frameset')[0], '50%,*'); 
    }); 
}

出典

2016-11-15 10:50:10 akovar

フレームセットのサイズがマウスのサイズ変更後に正しく調整されない

答えて

関連する問題