CSS左滾動

enter image description here 我有代碼CSS左滾動

<div class="slidermoveImgCont center float-left"> 
    <img id="SImg1" src="img/nat1.jpg" alt="gg" class="first simg alwaysfirst" name="actualImage1"> 
    <img id="SImg2" src="img/nat2.jpg" alt="gg" class="simg" name="actualImage2"> 
    <img id="SImg3" src="img/nat3.jpg" alt="gg" class="simg" name="actualImage3"> 
    <img id="SImg4" src="img/nat4.jpg" alt="gg" class="simg" name="actualImage4"> 
    <img id="SImg5" src="img/nat5.jpg" alt="gg" class="simg" name="actualImage5"> 
    <img id="SImg6" src="img/nat6.jpg" alt="gg" class="last simg" name="actualImage6"> 
    <img id="SImg7" src="img/nat7.jpg" alt="gg" class="dns simg" name="actualImage7"> 
    <img id="SImg8" src="img/nat8.jpg" alt="gg" class="dns simg" name="actualImage8"> 
    <img id="SImg9" src="img/nat9.jpg" alt="gg" class="dns simg" name="actualImage9"> 
    <img id="SImg10" src="img/nat10.jpg" alt="gg" class="dns simg" name="actualImage10"> 
    <img id="SImg11" src="img/nat11.jpg" alt="gg" class="dns simg" name="actualImage11"> 
    <img id="SImg12" src="img/nat12.jpg" alt="gg" class="dns simg alwayslost" name="actualImage12"> 
</div>

在哪裏我總是一次顯示六張圖片，我打算顯示在增加或減少類似sliding.how左值的剩餘圖像做我acheive它。我給寬度包含div和溢出：隱藏到包含div，然後我增加/減小圖像的包含div的左邊，我不能夠看到剩餘的圖像。我打算自己試試我的圖像滑塊。請在此幫助我。

的詳細信息：ⅰ其中加入我想acheive圖像，該圖像中，只有6個圖像被示出，上點擊箭頭按鈕，我想用left屬性與動畫

來源

2013-02-15 Mohamed Hussain

你能告訴我們一個例子，你究竟是什麼嘗試克實現？ – reinder 2013-02-15 09:16:26

我加入了圖像，什麼我試圖acheive。 – 2013-02-15 09:35:51

爲什麼不使用jquery滑塊插件 - 這裏有很多，因爲您似乎不知道如何編寫自己的代碼，所以現在可以更容易地獲得現成的代碼 – Pete 2013-02-15 09:41:59

我創建了一個滾動的jsfiddle爲您提供：http://jsfiddle.net/L4HRY/

基本上，你的窩容器內一個div（與固定的），所有的圖像都彼此相鄰。您可以設置溢出：隱藏您的容器上只適合容器內的圖像中可見：

<div class="slidermoveImgCont center float-left"> 
    <div> 
     //snap images 
    </div> 
</div>

CSS

.slidermoveImgCont 
{ 
    height: 100px; 
    width: 700px; 
    position: relative; 
    overflow: hidden; 
} 
.slidermoveImgCont div 
{ 
    position: absolute; 
    width: 1200px; 
}

然後你left和right

四處移動你內心的div這是的概念

來源

2013-02-15 10:05:40 reinder

感謝reinder.This到底是什麼我want.You拯救我的一天。 – 2013-02-15 10:55:27

回答

相關問題