HTML＆JQuery：另一頁頂部的Silde頁面

Question

我想要一頁在另一頁頂部滑動。當頁面滑動時，背景中的另一頁將消失。像在this網站上。當您點擊麥肯錫概覽按鈕時，該可見的HTML條會添加到幻燈片頁面，並且在後臺頁面被禁用。此外，它看起來像幻燈片預載的頁面。

我嘗試了幾個頁面滑塊的jQuery插件，但不是在上面提到的鏈接相同。不要在後臺禁用頁面。當它們隱藏時，它們隱藏整個頁面。但我想要一些可見的部分可用於用戶。請引導我。

Answer 1

「homeSlider」類是available for review on the site（搜索MC.homeSlider）它爲動畫不透明度和邊距右移。

imho它更容易在「#slider」和「＃slider.open」之間切換，併爲動畫使用css轉換。

代碼來完成這個看起來像這樣：

// jQuery的

$("#sliderBtn").click(function(){ 
    $("#slider").toggleClass("open"); 
}); 

// CSS

#slider {position:absolute;opacity:0;margin-left:300px;transition: opacity 2s, margin-left 1s;} 
#slider.open {opacity:1;margin-left:100px} 

當然倒臺是，舊的瀏覽器沒有能看到動畫。儘管適當地顯示開啓和關閉狀態，但它適當地降解。

jsbin：http://codepen.io/anon/pen/rhudB