如何滾動文本行，而不顯示滾動條

，當你看到螢火蟲的長文件名，你會發現一個範圍，告訴我們 - >

.FileName { 
    float: left; 
    width: 438px; 
}

我們已經爲此跨度預定義寬度！

q＃1：爲什麼我們在該div中溢出，我該如何解決這個問題？

q＃2（重要）：是否可以使該文件名可滾動而不顯示滾動條？

編輯
（使用jQuery或JavaScript或CSS）

在此先感謝

來源

2011-10-28 MoonLight

如果你不想要一個滾動條，但要滾動，那麼最明顯的解決方案是使用一些JavaScript。如果你到了jQuery，這裏的一些：

http://www.net-kit.com/jquery-custom-scrollbar-plugins/

我已經試過（http://www.demo.creamama.fr/plugin-scrollbar/）之一，設置包含在div文字overflow: hidden;和div包含滾動條到display: none;來模仿你的情況，這給了我一個沒有滾動條的滾動div。
不過，我認爲從UI的角度來看，如果沒有滾動條的滾動部分不是最好的想法。至少應該點亮（與Mac OS Lion滾動條一樣），表明您可以滾動或正在滾動。你可以設計一個javascript解決方案來實現這一點，例如使用一個小小的滾動條或指示器。

來源

2011-10-28 10:42:35 kasimir

謝謝你的回答/你會告訴我們在jsfiddle中的示例！ – MoonLight

我試圖在jsfiddle中快速拍打東西，但它並不容易。如果你可以嘗試實現jQuery解決方案之一，我很樂意看看它是否仍然無法正常工作。 – kasimir

你有一個溢出，因爲這種文字不能突破（有沒有空格）：

R1DA029_APP_SW_1212_2395_GENERIC_KT_REDBROWNBLUE_CID52_49_DB3210

你可以改變跨度到div中，給它們一個高度和一個溢出：隱藏。

HTML：

<div class="FileName">R1DA029_APP_SW_1212_2395_GENERIC_KT_REDBROWNBLUE_CID52_49_DB3210 asangsm.com.rar</div>

的CSS：

.FileName{ 
    float: left; 
    width: 438px; 
    height: 20px; 
    overflow: hidden; 
}

我不認爲這是可能使該文件名滾動而不顯示滾動條。

來源

2011-10-28 09:26:41 Mathieu

謝謝你的回答/「我不認爲這是可能的......」但我想我在網站上看到類似的東西 - 所以，應該有辦法做到這一點！ – MoonLight

也許你可以做些什麼，當你將鼠標懸停在文件名上時，文件名的文本在div中滾動？或者當你mouseover一個div變得可見通過文件的全長.FileName-div？ – Mathieu

但我能做些什麼關於滾動條！我只是想強制該文本滾動而沒有滾動條，只能用鼠標滾動它！ – MoonLight

短缺使用CSS3's marquee，我可以看到沒有簡單的解決方案。你將不得不使用Javascript。

根據避免換行符，您可以使用white-space: nowrap;。

來源

2011-10-28 10:42:00 ANeves

感謝您的意見 – MoonLight

如何滾動文本行，而不顯示滾動條

回答

相關問題