1

ご覧のとおり、左側のもの(初期化されたTinyMCEがない)は完全に機能します。 右側のもの(複数の初期化されたTinyMCEがあります)はすべて不安定です。

[左は右と同じページです。右だけが、TinyMCEの初期化後にFancyboxの上部から飛び出すすべての要素を示しています]

実例を見る

私の現在のセットアップでは、AJAXを使用してPHPページをロードするFancyboxがあります。ページのタブ移動(上記参照)は、DIVをスタックし、左側のナビゲーションのLIの1つに対するonclickイベント時に要求されたものを前方に移動することによって実現されます。すべての内部要素は絶対位置にあり、上/下および左/右が定義されています。TinyMCEが見えない場合、この設定は正常に機能します。

TinyMCEを初期化すると、すべての地獄が解き放たれます。(複数のブラウザで)正しくロードされることがありますが、ほとんどの場合、右上の画像のように動作します。私は運がないまま何時間もグーグルしてきました。どこから始めればいいのかわからない。どんな提案も素晴らしいでしょう!

HTML:

<div id="popup">
  <header>
    <a id="admin-link" class="fancybox" href="/dev/sbir/inc/login.php">[login]</a>
    <h1 id="head">Promote Value of SBIR</h1>
  </header>

  <ul id="nav">
    <li onclick="javascript:shiftUpContent(&quot;content_0&quot;);"><a href="#">Provide Success Stories</a></li>
    <li id="last"></li>
</ul>

  <div id="content">
    <div class="content" id="start">
      <h1>Directions</h1>
      <p>To view information on Promote Value of SBIR, select one of the sub-categories to the left.</p>
  </div>

  <div id="content_0" class="content">
    <h1>Provide Success Stories</h1>
    <p>Give Overview Presentation</p>
<ul>
  <li>It is a typical government contract</li>
  <li>It is competitive and I have to "beat someone else out"</li>
  <li>I don't have a chance against the big government contractors</li>
</ul>
<p>Other promotional strategies could include:</p>
<ul>
  <li>Conversations with current/past award winners</li>
  <li>Dr. Google assignments or in vivo browsing with client</li>
</ul>
<h2>Training Classes</h2>
<p>Search "SBIR Training", "SBIR Conferences", "SBIR Calendar" or "SBIR and name of an agency i.e. USDA, Navy, Army, etc" Some SBIR consultants give training classes from time to time as a way to solicit clients.</p>
<h2>External Content</h2>
<p><span style="text-decoration: underline;"><a href="/dev/sbir/www.zyn.com" target="_blank">www.zyn.</a>com</span><br> <a href="/dev/sbir/www.sbir.gov" target="_blank">www.sbir.guv</a></p>
</div>
</div>

JavaScript:

/* navigate through tabs of pop-up */
function shiftUpContent(id){
    topContent.style.zIndex = '5';
    if((topContent = document.getElementById(id)) === null){ return; }

    topContent.style.zIndex = '9998';
}

jQueryプラグインの初期化:

$(document).ready(function() {
    $(".fancybox").fancybox({
        fitToView       : true,
        nextClick       : false,
        closeClick      : false,
        arrows          : false,
        mouseWheel      : false,
        width           : '773px',
        height          : '630px',
        type            : 'ajax',
        beforeShow      : function(){ 
            topContent  = document.getElementById("start");
            document.title  = titleRoot;
            $("#popup .fancybox").fancybox({
                fitToView       : true,
                autoSize        : true,
                nextClick       : false,
                closeClick      : false,
                arrows          : false,
                mouseWheel      : false,
                type            : 'iframe',
                ajax            : {
                                    type    : 'POST',
                                    cache   : false,
                                    success : function(data){
                                        $.fancybox(data);
                                    }
                                  }
            });
            tinyMCE.init({
                mode        : "textareas",
                relative_urls   : false,
                constrain_menus : true
            });
        }
    });
});

関係のないコードをできるだけ削除しようとしましたが、問題がわからないため、何を残す必要があるかを知ることは困難です。

4

1 に答える 1

0

さて、合計約 7 時間のデバッグの後、まだ何もありません。セットアップが機能する場合もあれば、機能しない場合もあります。

私の修正は、ファンシーボックスをロードするためにAJAXの代わりにiframeに戻ることになりました。TinyMCE インスタンスを親ページから完全に分離することは、fancybox が閉じられるたびに完全に消滅することを意味します (そして、すべてが夢のように機能します。私はそれで行かなければなりません.

このコードの使用:

var i, t = tinyMCE.editors;
for (i in t){
    if (t.hasOwnProperty(i)){
        t[i].remove();
    }
}

ファンシーボックスの beforeClose のすべてのインスタンスを削除できましたが、問題の解決に違いはないようです。

于 2012-07-25T16:22:15.870 に答える