Firefox 中的 jquery hidescroll 给了我滚动条

发布于 2024-10-17 18:38:06 字数 1916 浏览 4 评论 0原文

我使用 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 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

峩卟喜欢 2024-10-24 18:38:07

这是因为默认的大纲

尝试在 layout.css 第 24 行添加 .playlist a{outline: none;}

its because of the default outline

try on layout.css line 24 add .playlist a{ outline: none;}

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文