有沒有辦法在Jquery Cycle中居中尋呼機縮略圖而不是左對齊？（jsFiddle）

我已經添加了一個傳呼機到我的jquery循環，並且事情工作正常。我想將尋呼機縮略圖居中（我實際上並沒有使用REAL縮略圖......只是將尋呼機號碼稱爲縮略圖）。有沒有辦法在Jquery Cycle中居中尋呼機縮略圖而不是左對齊？（jsFiddle）

所以，如果我有7張幻燈片，我想要pager1，pager2等。通過pager7居中，而不是左對齊。

我不確定它是否在我的CSS，但我去我的.css，並嘗試文本對齊：中心，但沒有做任何事情。我現在有這個在我的CSS：

.pager a { border: 1px solid #dde4ec; background: #465c71; text-decoration: none; margin: 0 5px; padding: 3px 5px; } 
.pager a.activeSlide { background: #dde4ec; } 
.pager a:focus { outline: none; 
-moz-box-shadow: 5px 5px 2px #fff; 
-webkit-box-shadow: 5px 5px 2px #fff; 
box-shadow: 5px 5px 2px #fff;}

的jsfiddle（感謝PI）位於：http://jsfiddle.net/jasonpaulweber/SjXVc/

任何建議，將不勝感激！

來源

2012-02-15 Jason Weber

你可以發佈一個試玩？ http://jsfiddle.net – PiTheNumber 2012-02-15 10:18:44

是的PI ...我現在正在這樣做。我將如何在其中包含Jquery Cycle All.js？只需粘貼整個東西？ – 2012-02-15 10:34:43

看左邊的「添加資源」，在這裏你可以添加你的文件。或者只是粘貼它。 – PiTheNumber 2012-02-15 10:41:55

這裏：http://jsfiddle.net/NpUxP/

display: inline-block，而不是僅僅block並沒有float爲.pager a

來源

2012-02-15 10:55:58 welldan97

請注意，這在IE7中不起作用，解決方案是使用'display：inline'爲IE7添加一個條件CSS，並且它可以工作:) – jackJoe 2012-02-15 10:59:48

Welldan，您的解決方案非常完美！它完成了我想要的！非常感謝您花時間回覆，甚至展示您自己的小提琴。就IE7而言，感謝Jackjoe的單挑......但我並不擔心那些過時的瀏覽器。但我會檢查它。再次感謝Welldan，很好的回答！我希望我擁有1％的js/css知識！ – 2012-02-15 11:17:25

您還可以使用自動利潤率做到這一點：

body { 
    text-align: center; 
} 

.pager { 
    margin: 0px auto; 
    width: 220px; 
}

http://jsfiddle.net/SjXVc/1/

來源

2012-02-15 11:05:41 PiTheNumber

感謝您的輸入，PI，並花時間幫助我與jsfiddle！我理解你的思維過程，這很有道理 - 你真的幫助我理解CSS。我真的很感謝你的幫助！ – 2012-02-15 11:15:43

有沒有辦法在Jquery Cycle中居中尋呼機縮略圖而不是左對齊？ （jsFiddle）

回答

相關問題

有沒有辦法在Jquery Cycle中居中尋呼機縮略圖而不是左對齊？（jsFiddle）