2013-10-29 69 views
0

我正在一個網站上,我提出這個問題的一個例子,我在這裏CSS接壤頁面上看不見的收縮

http://codepen.io/avovk/pen/pFkmb

這是一個600頁的股利和兩個紫色的邊界是在左側和右側通過在各自的側面設置負向位置來創建。當我拖動瀏覽器窗口使頁面寬度爲600像素或更少時,左邊框消失,但如果我滾動到右邊,右邊框仍然可見。我希望這兩個邊框僅在頁面寬度爲600像素或更寬時纔可見,否則用戶應該無法通過向右滾動來查看右邊框。有點像左邊界如何消失。

是的邊界必須是Divs,因爲它們是我的實際網站中的圖像,我想這樣做沒有JavaScript。

感謝,要完成這一 亞歷

回答

0

一種方法是用CSS media queries

@media only screen and (max-width:600px) { 
    #rightBorder, #leftBorder { 
     display: none; 
    } 
} 
+0

但是當它的610個像素,仍然可以滾動查看它的其餘部分。它應該部分消失。 – Avovk

+0

嗯,你沒有在你的問題中提到過......你明確地說過:「我希望這兩個邊界只在頁面爲600像素或更寬時纔可見」。 – glomad