如何中心幻燈片bxslider，所以沒有幻燈片被裁剪

請看看當前網站我發展：http://debourg-dev.ch/eliterent/對於底部的品牌標誌滑塊，我使用bxslider。我想知道是否有辦法集中幻燈片（徽標），並防止bxslider從「半顯示」徽標，因爲根據查看它的分辨率，有時會顯示裁剪徽標，如果它不能將它們全部裝入屏幕。理想情況下，我只想讓它顯示可以放入當前窗口的完整徽標。如何中心幻燈片bxslider，所以沒有幻燈片被裁剪

非常感謝

來源

2013-06-02 user1280853

這是很容易通過調整移除此居中在其li每個圖像：

.bx-wrapper img { 
    display: block; 
}

，並添加此：

.bx-wrapper li { 
    text-align: center; 
}

但我認爲你是出關於種植問題的運氣。我會建議在li S設定一％的寬度，但將它們設置在相對於ul這是非常廣泛的，所以這是行不通的。不過，你可以用JS做。

來源

2013-06-02 13:36:18

神奇@ ralph.m感謝這個！ – AdamJones

爲了擺脫裁剪並使幻燈片適合不管分辨率，您需要知道幻燈片寬度和邊距，然後您可以使用bxslider容器的寬度來計算maxSlides。

Math.floor($('#container').width()/(slide_width + slide_margin));

See working example

來源

2014-12-17 15:32:35 gabdara

我是在同一條船上，然後我發現這...這工作，但你必須每次調整頁面......這工程確定的時間刷新頁面，但與iPad或東西，可以改變它的屏幕分辨率你把它，它會更好，如果我可以調整瀏覽器的大小來查看更改...有沒有辦法調整此代碼，以便它可以這樣工作？ –

您可以在CSS中使用與視口相關的度量單位。 – ZzZombo

如何中心幻燈片bxslider，所以沒有幻燈片被裁剪

回答

相關問題