如何隐藏skitter-slider jquery插件的Next和Prev导航按钮

时间:2014-03-19 07:32:04

标签: jquery css skitter-slider

skitter-slider插件设置了以下道具,但每当我将鼠标悬停在幻灯片上时,下一个和上一个按钮都会变得可见。 即使鼠标悬停在幻灯片上,我也需要删除按钮。我认为它应该由导航处理:false但是它不起作用。

<!-- Init Skitter -->
    <script type="text/javascript" language="javascript">
        $(document).ready(function() {
            $('.box_skitter_large').css({width: 530, height: 110}).skitter({
                theme: 'round',
                numbers_align: 'center',
                navigation: false,
                enable_navigation_keys: false,
                progressbar: false, 
                dots: true, 
                preview: false,
                hideTools: true
            });
        });
    </script>

我还尝试在skitter.styles.css文件中的所有后续类中添加display:none。

.skitter-round .prev_button, 
.skitter-round .next_button, 

2 个答案:

答案 0 :(得分:1)

打开 skitter.styles.css 并将此行display: block;更改为

 display: none !important;

skitter.styles.css

    /* =Round theme
    -------------------------------------------------------------- */
.skitter-round .prev_button, 
.skitter-round .next_button, 
.skitter-round .play_pause_button, 
.skitter-round .focus_button 
{
    display: none !important; // change to this
    background: url('../images/sprite-round.png') no-repeat;
}

答案 1 :(得分:1)

你可以使用display:none!important;解决这个问题。