2011-11-16 8 views
0

私はこの問題に関する十分な研究を行ってきましたが、私にはうまくいく解決策が見つかりませんでした。 this linkに行くと、iFrame Vimeoの埋め込みにリンクするリストを作成するのに回避策を使用したことがわかります。私はこれでうまくいくだろうが、ビデオはオーバーフローによってちょうど積み重なって隠されているので、navリストの別のタイトルをクリックすると、ビデオが再生され続ける。私はこのコンテンツ・スイッチャー()をJSを使用せずに開始点として使用しました。その後、FirefoxにJSを組み込んだとき、ビデオの再生が停止しましたが、この修正はChromeまたはIE(here's the link so you can test for yourselves)では機能しません。Divのw/Navリストへのページのロードとアンロード

私はプログラマーではないが、私は学びたいと思っている。誰かが、これがFirefox以外のブラウザと互換性がない理由を理解するのを助けることができたら、大いに感謝します。私はJSをよく理解したいと思っています.JSファイルには必要以上に多くの構文があることを知っています。誰かが私に修正を求める手助けをすることができたら、私はとても感謝しています!

ありがとうございます!

<body style="width: 98%;"> 

    <div style="width: 625px; margin: 0 auto 0 auto;"> 

<div id="content-slider"> 
    <ul id="content-slider-inside"> 
     <li id="one"><object type="text/html" data="levelland.html" style="width:100%; height:400px; margin:1%;"></object></a></li> 
     <li id="two"><object type="text/html" data="legacy.html" style="width:100%; height:400px; margin:1%;"></object></a></li> 
     <li id="three">3</li> 
     <li id="four">4</li> 
     <li id="five">5</li> 
    </ul> 
</div> 

<ul id="navigation"> 
    <li><a href="#one" class="selected">1</a></li> 

    <li><a href="#two">2</a></li> 
    <li><a href="#three">3</a></li> 
    <li><a href="#four">4</a></li> 
    <li><a href="#five">5</a></li> 
</ul> 

$(document).ready(
function() { 

    var currentHash = location.hash.split("#"); 

    if (currentHash.length > 1) { 

     var currentHashString = currentHash[1].toString(); 

     $("#navigation li a").removeClass("selected"); 

     $("#navigation li a[href*="+currentHashString+"]").addClass("selected"); 

     var contentCollection = document.getElementsByTagName("li"); 

     for (i=0;i<contentCollection.length;i++) { 
      if (contentCollection[i].id) { 
       if (contentCollection[i].id === currentHashString || currentHashString === "") { 
        $(contentCollection[i]).fadeIn(650); 
       } else { 
        $(contentCollection[i]).fadeOut(650).css("display", "none"); 
        if (location.hash !== "#") { 
         location.hash = "#"+currentHash[1]; 
        } // if 
       } // else 
      } // if 
     } // for 

    } else { 
     var contentCollection = document.getElementsByTagName("li"); 

     for (i=0;i<contentCollection.length;i++) { 
      if (contentCollection[i].id) { 
       if (contentCollection[i].id !== "one") { 
        $(contentCollection[i]).fadeOut(650).css("display", "none"); 
       } 
      } // if 
     } // for 
    } // else 

    $("#navigation li a").click(function() { 

            var myClicked = this.href.split("#"); 

            $("#navigation li a").removeClass("selected"); 

            this.className = "selected"; 

            var contentCollection = document.getElementsByTagName("li"); 

            for (i=0;i<contentCollection.length;i++) { 
             if (contentCollection[i].id) { 
              if (contentCollection[i].id === myClicked[1]) { 
               $(contentCollection[i]).fadeIn(650);  
                } else { 
               $(contentCollection[i]).fadeOut(650).css("display", "none"); 
                if (location.hash !== "#") { 
                 location.hash = "#"+myClicked[1]; 
                } 

               } // else 

             } // if 
            } // for 
            return false; 
           } // click func 

          ); // click event 
    } // anon func 1 

    ); // ready 

答えて

0

あなたがここにもあなたのcodewを掲載場合、それははるかに簡単だったでしょうが、あなたのポストから私はあなたが離れてから移動後の各フレームは「非表示」であることを収集します。私はこの問題を克服する最善の方法は、html()関数を使用してそれらを隠す各フレームを "取り除く"ことだと思う。タイトルがクリックされるたびに、$("#frame").html("<frame ... ")などを使用してメインフレームのHTMLコンテンツを変更します。あなたはここで多くを読むことができます。http://api.jquery.com/html/

ようにあなたがさらにquestioを持っている場合は、ちょうどあなたのコードを投稿し、私はあなた

+0

のためにそれを修正します、私はコンテンツを編集しました私が行ったことをhttp://melissaloucastellano.com/testsite/index.html#fourで見ることができます。あなたのタイムリーな返答をありがとう!大変感謝しています。私はJSが複雑すぎるように感じていますが、すべてのブラウザで互換性があれば使用できます。 – user1048876

関連する問題