CSS水平滾動溢出與jQuery滑塊

我想安裝一個全屏幕的jQuery滑塊。我把這個項目分成了兩個步驟1）CSS和2）js。CSS水平滾動溢出與jQuery滑塊

1）CSS，下面是我拍攝的照片（沒有固定高度），下面是我目前無法使用的代碼。

Example http://i43.tinypic.com/a1ocxj.jpg

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
    <style type="text/css"> 

     /* Positioning */ 
     #container { width: 2500px; } 
     .block { display: inline; } 

     /* Styling */ 
     .block img { padding: 5px; } 

    </style> 
</head> 
<body> 
    <div id="container"> 
     <div class="block"><img src="http://i42.tinypic.com/1zp2poz.gif"></div> 
     <div class="block"><img src="http://i42.tinypic.com/1zp2poz.gif"></div> 
     <div class="block"><img src="http://i42.tinypic.com/1zp2poz.gif"></div> 
    </div> 
</body> 
</html>

2）投票，使用jQuery我想的div向左滑動他們點擊後...像jQuery Coda Slider如果可能的話。

謝謝，任何幫助表示讚賞。

來源

2010-05-17 Jeffrey

損壞的鏈接，新鏈接很可能是這樣的：http://kevinbatdorf.github.io/codaslider/ – 2016-08-08 23:20:30

您需要通過設置容器div的CSS開始有一個固定的寬度和溢出設置爲隱藏所以只有是什麼內的區域顯示出來：

#container{ 
    width:500px; 
    height:200px; 
    overflow:hidden; 
}

你是怎麼想的滑塊上班？自動？按下按鈕？還有一些大概可以照顧它自動

來源

2010-05-17 17:17:23 kilrizzy

我希望能夠點擊下一個div，向左滑動（有點像上圖）。也在容器外，我需要有一個導航鏈接，將去的股利。 – Jeffrey 2010-05-17 17:41:51

我真的需要它看起來像上面的圖形，所以顯示下一張幻燈片是至關重要的，所有的幻燈片將是不同的高度。所以我將設置overflow-x在主體中隱藏並剪輯：auto。 – Jeffrey 2010-05-17 17:57:04

看那個東西的幾個插件：http://apirocks.com/html5/html5.html （測試與Chrome）

來源

2010-05-17 17:42:58

不錯。非常接近我需要的東西。不知道它是否可以設置，以便容器滑動並且頁眉和頁腳保持不變。 – Jeffrey 2010-05-17 18:04:12

我想用幾個絕對定位的div你可以 – 2010-05-17 20:23:08

沒問題，搞砸了它，我很難讓相關頁腳留在絕對滑動容器下面......任何想法。 – Jeffrey 2010-05-18 18:48:12

CSS水平滾動溢出與jQuery滑塊

回答

相關問題