jMediaelement垂直音量滑塊

我正在使用jMediaelement定製HTML5音頻播放器。不幸的是，客戶現在需要一個垂直音量滑塊。jMediaelement垂直音量滑塊

當調用API jMediaelement，我只能用這個標記：

<div class="volume-slider" title="volume slider"></div>

...這將通過水平的音量滑塊來代替。如何將音量手柄調整爲垂直（從底部=靜音到頂部=大聲）？

Screenshot of my player

PS：我已經開了一個issue at Sourceforge，但是，目前還沒有答案。

來源

2012-12-08 Mateng

幸運的是，亞歷山大replied的問題自己的文章。他的工作解決方案如下：

這很簡單。 JME使用jQuery-UI滑塊和jQuery-UI 自動檢測你想要一個垂直或水平滑塊由你的CSS。你必須做的唯一事情就是給你的滑塊一個更大的高度。

以下CSS將創建一個垂直滾動條：
.volume-slider { 
    height: 300px; 
    width: 20px; 
} 
如果這沒有幫助，你可以通過一個垂直選項滑塊。

來源

2012-12-12 18:55:15 Mateng

我不熟悉jMediaelement API，但可以使用css將音量逆時針旋轉90度。您可能不得不攪亂事件處理程序以使音量控制手柄跟蹤垂直移動而不是水平移動，但這不應該很難。

以下是有關使用CSS旋轉

http://davidwalsh.name/css-transform-rotate

來源

2012-12-08 15:02:02 hobberwickey

說實話，用CSS3旋轉一個元素似乎會產生比解決問題更多的問題。過時的瀏覽器，從IE8開始呢？ – Mateng

這是在我發佈的文章中提到的，你可以用IE的過濾器來完成它。看起來像其他答案是一件容易的事情。 – hobberwickey

jMediaelement垂直音量滑塊

回答

相關問題