新到您的論壇 - 請原諒任何失誤。使用滑動顯示/幻燈片放映。該節目的作品，但節目下面的「點」，這應該跟隨用戶滑動不。我嘗試在列表項中添加一個「a」標籤，並嘗試使用「on」類的跨度。滑動顯示導航「點」

HTML

<div class="dots"> 
    <ul id='position'> 
     <li class='on'></li> 
     <li></li> 
     <li></li> 
     <li></li> 
     <li></li> 
    </ul> 
</div>

CSS

.dots { 
    margin: 7px auto 0px; 
    position: relative; 
    max-width: 680px; 
} 
.dots a { 
    color: rgb(205, 205, 205) !important; 
    font-style: normal; 
} 
.dots #position { 
    list-style: none; 
    margin: 0px; 
    padding: 0px; 
    text-align: center; 
} 
.dots #position li { 
    background: rgb(255, 255, 255); 
    margin: 0px 2px; 
    border-radius: 10px; 
    width: 10px; 
    height: 10px; 
    display: none; 
    cursor: pointer; 
    box-shadow: inset 0px 1px 3px grey, 0px 0px 1px 1px #8b8989; 
} 
.dots #position li.on { 
    box-shadow: inset 0px 1px 3px -1px #7EC153, 0px 1px 2px rgba(0, 0, 0, 0.5); 
    background-color: rgb(126, 193, 83); 
}

直播現場演示：http://192.185.168.157/~rylex658/mobile/residential-cabinets.html

來源

2014-01-17 BSim

刷卡？喜歡移動開發，並允許用戶「滑動」他們的手指旋轉幻燈片...？ –

@Nicholas Hazel是的，手指輕掃以展示幻燈片。節目下的點應與視圖中的圖像匹配，並允許用戶移動幻燈片。 – BSim

Swipeshow的作者在這裏。

.dots #position應該是.dots#position - 試一試。此外，無需使用<li>來填充它 - 它們將由圖書館爲您完成。

來源

2014-03-23 03:37:06

滑動顯示導航「點」

HTML

CSS

回答

相關問題