鏈接改變對象的div

我有以下的HTML：在子文件夾side_menu 鏈接改變對象的div

<div class="container"> 

    <header> 
     <object type="text/html" data="nav_bar/navigation.html" style="width:1300px; height:70px;"></object> 
    </header> 

    <nav> 
     <object type="text/html" data="side_menu/dates.html" style="width:300px; height:500px;"></object> 
    </nav> 

    <article> 
     <object type="text/html" data="side_main/introduction.html" style="width:1002px; height:500px;"></object> 
    </article> 

</div>

文件dates.html是菜單。我希望其中一個按鈕將文章元素中的對象更改爲 ../side_main/main_side.html

默認情況下，它現在將頁面加載到導航div（_self）中。我已經改變了目標_top和_parent和不斷加載頁面_self

頁面佈局與CSS做：

div.container { 
     width: 100%; 
     border: 1px solid gray; 
     background-color: white; 
    } 

    header, footer { 
     padding: 0em; 
     color: white; 
     background-color: black; 
     clear: left; 
    } 

    footer 
    { 
     padding: 1em; 
     text-align: center;} 

    nav { 
     float: left; 
     max-width: 300px; 
     margin: 0; 
     padding: 0em; 
     overflow:hidden; 
    } 

    article { 
     margin-left: 1px; 
     border-left: none; 
     padding: 0em; 
     overflow:hidden; 
    } 
</style>

我不是一個程序員或網絡開發。我很欣賞任何解決方案，最簡單的可能。由於

來源

2016-08-29 jcorzo

我認爲你將需要對此進行編程。你在用什麼？ jQuery，香草JS或其他？ – Knostradamus

我可以使用JS，但我試圖儘可能保持簡單。它適用於框架，但它在任何地方都表示使用它們並不是一個好主意。我開始研究iframe，但是他們讀到CSS是要走的路線 – jcorzo

您需要更改對象中的數據屬性.. CSS無法做到這一點。我會建議你爲此做一個好運。如果你蓋了，他們會來的。 – Knostradamus

不知道這是最好的方式，但它的工作原理：我添加了相同的DIV中的其他對象和按鈕添加ID到每個對象

<article> 
      <object type="text/html" id="intro" data="side_main/introduction.html" style="width:1002px; height:500px;"></object> 
      <object type="text/html" id="dec7" data="side_main/main_side.html" style="width:1002px; height:500px;"></object> 
</article>

我增加了一個onclick事件通過一些給函數

<a href="#" onclick="show_div(1)"><December 7</a>

功能改變每個DIV取決於傳遞給它

<script type="text/javascript"> 
     function show_div(arg) { 
      document.getElementById("intro").style.display = "none"; 
      document.getElementById("dec7").style.display = "none"; 
      if (arg == 1) { 
      document.getElementById("dec7").style.display = "block"; 
      } else { 
      document.getElementById("intro").style.display = "block"; 
      } 
     } 
</script>

的數量顯示

來源

2016-08-31 18:39:23 jcorzo

鏈接改變對象的div

回答

相關問題