删除滑块透明度

时间:2014-06-09 01:24:18

标签: jquery css slider less

在我的wordpress主页上,让我们考虑以下三个要素:

  • 标题
  • Shadow Box(标题下方 - 用于其他页面,但不是主页)
  • 图片滑块(在标题下方,覆盖阴影框)

滑块有一些不合需要的透明效果,即我可以在它下面看到一些暗影盒。 我想消除这些透明效果

下面是Shadow Box的CSS。 (请注意,尽管有&:before,但在主页上,此Shadow Box实际上显示在标题下方。

.header {
    &:before {
        position: absolute;
        right: 0;
        left: 0;
        bottom: 0;
        z-index: -1;
        height: 1px;
        content: '';
        .box-shadow(0 0 35px 12px #000);
    }
}

滑块脚本。我不知道如何在参数中设置不透明度。

<script type="text/javascript">
//    jQuery(window).load(function() {
        jQuery(function() {
            var myCamera = jQuery('#camera<?php echo $motopress_cam_id; ?>');
            if (!myCamera.hasClass('motopress-camera')) {
                myCamera.addClass('motopress-camera');
                myCamera.camera({
                    alignment           : 'topCenter', //topLeft, topCenter, topRight, centerLeft, center, centerRight, bottomLeft, bottomCenter, bottomRight
                    autoAdvance         : <?php echo of_get_option('sl_slideshow'); ?>,   //true, false
                    mobileAutoAdvance   : <?php echo of_get_option('sl_slideshow'); ?>, //true, false. Auto-advancing for mobile devices
                    barDirection        : 'leftToRight',    //'leftToRight', 'rightToLeft', 'topToBottom', 'bottomToTop'
                    barPosition         : 'top',    //'bottom', 'left', 'top', 'right'
                    cols                : <?php echo of_get_option('sl_columns'); ?>,
                    easing              : 'easeOutQuad',  //for the complete list http://jqueryui.com/demos/effect/easing.html
                    mobileEasing        : '',   //leave empty if you want to display the same easing on mobile devices and on desktop etc.
                    fx                  : '<?php echo of_get_option('sl_effect'); ?>',    //'random','simpleFade', 'curtainTopLeft', 'curtainTopRight', 'curtainBottomLeft',          'curtainBottomRight', 'curtainSliceLeft', 'curtainSliceRight', 'blindCurtainTopLeft', 'blindCurtainTopRight', 'blindCurtainBottomLeft', 'blindCurtainBottomRight', 'blindCurtainSliceBottom', 'blindCurtainSliceTop', 'stampede', 'mosaic', 'mosaicReverse', 'mosaicRandom', 'mosaicSpiral', 'mosaicSpiralReverse', 'topLeftBottomRight', 'bottomRightTopLeft', 'bottomLeftTopRight', 'bottomLeftTopRight'
                                                    //you can also use more than one effect, just separate them with commas: 'simpleFade, scrollRight, scrollBottom'
                    mobileFx            : '',   //leave empty if you want to display the same effect on mobile devices and on desktop etc.
                    gridDifference      : 250,  //to make the grid blocks slower than the slices, this value must be smaller than transPeriod
                    height              : '31.8%', //here you can type pixels (for instance '300px'), a percentage (relative to the width of the slideshow, for instance '50%') or 'auto'
                    imagePath           : 'images/',    //he path to the image folder (it serves for the blank.gif, when you want to display videos)
                    loader              : '<?php echo of_get_option('sl_loader'); ?>',    //pie, bar, none (even if you choose "pie", old browsers like IE8- can't display it... they will display always a loading bar)
                    loaderColor         : '#FF3610',
                    loaderBgColor       : '#fff',
                    loaderOpacity       : 1,    //0, .1, .2, .3, .4, .5, .6, .7, .8, .9, 1
                    loaderPadding       : 0,    //how many empty pixels you want to display between the loader and its background
                    loaderStroke        : 3,    //the thickness both of the pie loader and of the bar loader. Remember: for the pie, the loader thickness must be less than a half of the pie diameter
                    minHeight           : '147px',  //you can also leave it blank
                    navigation          : false, //true or false, to display or not the navigation buttons
                    navigationHover     : false,    //if true the navigation button (prev, next and play/stop buttons) will be visible on hover state only, if false they will be visible always
                    pagination          : <?php echo of_get_option('sl_control_nav'); ?>,
                    playPause           : false,   //true or false, to display or not the play/pause buttons
                    pieDiameter         : 33,
                    piePosition         : 'rightTop',   //'rightTop', 'leftTop', 'leftBottom', 'rightBottom'
                    portrait            : true, //true, false. Select true if you don't want that your images are cropped
                    rows                : <?php echo of_get_option('sl_rows'); ?>,
                    slicedCols          : <?php echo of_get_option('sl_columns'); ?>,
                    slicedRows          : <?php echo of_get_option('sl_rows'); ?>,
                    time                : <?php echo of_get_option('sl_pausetime'); ?>,   //milliseconds between the end of the sliding effect and the start of the next one
                    transPeriod         : <?php echo of_get_option('sl_animation_speed'); ?>, //lenght of the sliding effect in milliseconds

                                    ////////callbacks

                    onEndTransition     : function() {  },  //this callback is invoked when the transition effect ends
                    onLoaded            : function() {  },  //this callback is invoked when the image on a slide has completely loaded
                    onStartLoading      : function() {  },  //this callback is invoked when the image on a slide start loading
                    onStartTransition   : function() {  }   //this callback is invoked when the transition effect starts
                });
            }
        });
//    });
</script>

0 个答案:

没有答案