Firefox 中的 jquery hidescroll 给了我滚动条
我使用 flowplayer 创建了一个带有播放列表的小型媒体播放器。我使用 hoverscroll 插件 使播放列表在悬停时滚动。但我在 Firefox 中遇到了一个小问题。当我单击播放列表中的链接之一来播放视频/音乐时,它会显示 Firefox 默认滚动条。
您可以在此处查看演示
这是代码的预览 JS:
// Override default parameters onload
jQuery.fn.hoverscroll.params = jQuery.extend(jQuery.fn.hoverscroll.params, {
vertical : true,
width: 355,
height: 100,
arrows: false
});
flowplayer("video", "assets/flowplayer/flowplayer-3.2.6.swf", {
clip: {
// by default do not auto play
autoPlay: false
},
playlist: 'assets/gallery/mrss-video.xml',
// show playlist buttons in controlbar
plugins: {
controls: {
url: 'flowplayer.controls-3.2.4.swf',
buttonColor: 'rgba(0, 0, 0, 0.9)',
buttonOverColor: '#000000',
backgroundColor: '#D7D7D7',
backgroundGradient: 'medium',
sliderColor: '#FFFFFF',
sliderBorder: '1px solid #808080',
volumeSliderColor: '#FFFFFF',
volumeBorder: '1px solid #808080',
timeColor: '#000000',
durationColor: '#535353',
playlist: true
}
},
onLoad: function() {
jQuery('#video-pl .playlist').hoverscroll();
}
});
$f("video").playlist("#video-pl .playlist", {loop: true});
HTML:
<div id="media-video" class="tabs">
<div class="media-container">
<div id="video" class="flow-container"></div>
</div>
<div id="video-pl">
<ul class="playlist">
<li><a href="#"><strong>${title}</strong> - <samp>${author}</samp></a></li>
</ul>
</div>
</div>
I created a small media player with playlist using flowplayer. I used a hoverscroll plugin to make the playlist scroll on hover. But I have a small issue in Firefox. When I click on one of the links in the playlist to play a video/music it displays Firefox default scroll bars.
You can check out the demo here
Here is a preview of the code
JS:
// Override default parameters onload
jQuery.fn.hoverscroll.params = jQuery.extend(jQuery.fn.hoverscroll.params, {
vertical : true,
width: 355,
height: 100,
arrows: false
});
flowplayer("video", "assets/flowplayer/flowplayer-3.2.6.swf", {
clip: {
// by default do not auto play
autoPlay: false
},
playlist: 'assets/gallery/mrss-video.xml',
// show playlist buttons in controlbar
plugins: {
controls: {
url: 'flowplayer.controls-3.2.4.swf',
buttonColor: 'rgba(0, 0, 0, 0.9)',
buttonOverColor: '#000000',
backgroundColor: '#D7D7D7',
backgroundGradient: 'medium',
sliderColor: '#FFFFFF',
sliderBorder: '1px solid #808080',
volumeSliderColor: '#FFFFFF',
volumeBorder: '1px solid #808080',
timeColor: '#000000',
durationColor: '#535353',
playlist: true
}
},
onLoad: function() {
jQuery('#video-pl .playlist').hoverscroll();
}
});
$f("video").playlist("#video-pl .playlist", {loop: true});
HTML:
<div id="media-video" class="tabs">
<div class="media-container">
<div id="video" class="flow-container"></div>
</div>
<div id="video-pl">
<ul class="playlist">
<li><a href="#"><strong>${title}</strong> - <samp>${author}</samp></a></li>
</ul>
</div>
</div>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
这是因为默认的大纲
尝试在
layout.css
第 24 行添加.playlist a{outline: none;}
its because of the default outline
try on
layout.css
line 24 add.playlist a{ outline: none;}