Responsiveslides轉換看起來很奇怪

我已經包括一個responsiveslides幻燈片顯示與標準設置直接從網頁。它有效，但過渡看起來很奇怪。在拍攝正確大小之前，圖像會填充整個屏幕寬度。我也得到了所有圖像上的「li-dot」，免除了第一個圖像。這可能連接到CSS，但我找不到一種方法來糾正它。任何有關這個問題的幫助將不勝感激。Responsiveslides轉換看起來很奇怪

代碼摘錄

<%@ Page Title="XXX" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> 

<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server"> 

<script src="Scripts/responsiveslides.js"></script> 

<script> 
    $(function() { 
     $(".rslides").responsiveSlides(); 
    }); 
</script> 
<div> 
    <ul class="rslides"> 
    <li><img src="Images/Slides/SAMS-1.png" /></li> 
    <li><img src="Images/Slides/SAMS-2.png" /></li> 
    <li><img src="Images/Slides/SAMS-3.png" /></li> 

</ul> 
</div>

CSS

*! http://responsiveslides.com v1.54 by @viljamis */ 


.rslides { 
    position: relative; 
    list-style-type: none; 
    overflow: hidden; 
    width: 100%; 
    padding: 0; 
    margin: 0; 
    } 


.rslides li { 
    -webkit-backface-visibility: hidden; 
    position: absolute; 
    display: none; 
    list-style-type: none; 
    width: 100%; 
    left: 0; 
    top: 0; 
    } 


.rslides li:first-child { 
    position: relative; 
    display: block; 
    float: left; 
    } 


.rslides img { 
    display: block; 
    height: auto; 
    float: left; 
    width: 100%; 
    border: 0; 
    }

來源

2014-01-05 user3162086

沒有代碼提供，沒有幫助... – Akaryatrh

好吧，我現在用一些代碼完成了我的問題。 – user3162086

我想在這裏撥弄你的代碼：http://jsfiddle.net/aLy2D/1/（用尋呼機和導航選項），一切工作正常（嗯，我猜是這樣。 ..）。

其實，我看到了你的CSS代碼中的錯字，也許你的問題來自這裏：

*! http://responsiveslides.com v1.54 by @viljamis */ 

// Multiline comment should start with /* 
/* http://responsiveslides.com v1.54 by @viljamis */

如果你想顯示的尋呼機，你必須設置一個選項：

$(".rslides").responsiveSlides({ 
    pager: true 
});

完整文檔，請點擊這裏：http://responsiveslides.com/

編輯：我更新了小提琴與方法的document.ready

來源

2014-01-05 11:39:26 Akaryatrh

Responsiveslides轉換看起來很奇怪

回答

相關問題