jquery - 滑動iframe隱藏div

Question

我的頁面有左側菜單和右側內容的鏈接。 當點擊內容中的鏈接時，我需要一個iframe加載鏈接中的內容，然後出現，以便它覆蓋具有內容的右側div。

這個iframe在不需要時應該被最小化，並且應該看起來像一個底部的欄，它總是浮動的，當它到達底部時，它應該在頁腳欄上方可見。

任何人都可以告訴我如何做到這一點。如果提供例子會好得多。

感謝， 桑迪普

進出口安裝了什麼我想演示佈局。

Answer 1

如果你組織你的右側的內容與一個包含分區，且該分區中作出這樣握着你的常規內容和一個iframe嵌套式div;然後你可以設置單擊處理你的鏈接，將隱藏div嵌套，並顯示在iframe：

$(document).ready(function() { 
    $('#inner_div > a').live('click', function() { 
     $('#inner_div').slideUp();//just an example animation, you can set whatever attributes you would like with jquery, like just change the height with .css({height: '0px'}) 
     $('#iframe_id').slideDown(); 
    }); 
}); 
<div id="outer_div"> 
    <div id="inner_div"> 
     <a href="some_link.html" target="iframe_id">Link Text</a> 
    </div> 
    <iframe id="iframe_id" style="display:none;"></iframe> 
</div> 

---- ----編輯

至於附着於底部的浮動欄頁：

<div id="floating_footer" style="position: absolute; bottom: 0px; right: 0px; width: 90%; height: 50px; background-color:#069;"></div> 

如果你想隱藏這個「浮動DIV」當iframe中顯示出來，只需添加下面的JavaScript代碼（右與其他效果基本show /了slideDown代碼）：

$('#floating_footer').slideUp();