Question

我已经对这个问题进行了充分的研究，还没有找到适合我的解决方案。如果你转到this link，你会看到我使用了一个解决方法来创建一个链接到iFrame Vimeo嵌入的列表。我会没事的，但是当点击导航列表中的另一个标题时，视频会继续播放，因为视频只是堆叠并被溢出隐藏。我使用这个内容切换器（）作为起点，没有JS，然后当我在JS中合并JS时，视频停止播放，但这个修复在Chrome或IE中不起作用（here's the link so you can test for yourselves ）。

你会注意到我的代码（和问题），我不是程序员，但我正在努力学习。如果有人可以帮助我理解为什么这与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

Answer 1

如果你在这里发布你的代码也会容易得多，但是从你的帖子中我得知，一旦你离开它，每个框架都是“隐藏的”。我认为克服这个问题的最好方法是通过使用html（）函数“删除”隐藏它们的每个框架。因此，每次单击标题时，请使用例如$("#frame").html("<frame ... ")来更改主框架的html内容。你可以在这里阅读更多内容：http：//api.jquery.com/html/

如果您有进一步的问题，只需发布您的代码，我会为您修复

将页面加载和卸载到带有导航列表的Div中

1 个答案: