Float change panel opacity on hover

The default graphics card changes from opacity: .5 to opacity: 1 on hover. I would like to invert this, but I cannot find anyone to do this. This is the code I am currently using.

$.extend(true, opts.flot, {
    series: {
        points: { show: false },
        bars: {
            align      : 'center',
            order      : (opts.stacked) ? null : true,
            show       : true,
            border     : false,
            fill       : 1,
            fillColor  : null,
            horizontal : opts.horizontal,
            barWidth   : (opts.stacked) ? 0.6 : 0.6 / opts.data.length,
            lineWidth  : 0
        },
        lines: { show: false },
        pie: { show: false }
    }
});

      

+3


source to share


1 answer


Use something like this in your settings to give you opacity 1

hover and opacity 0.5

hover (here with red):

color: 'rgba(255, 0, 0, 1.0)',
highlightColor: 'rgba(255, 255, 255, 0.5)',
bars: {
    show: true,
    fillColor: 'rgba(255, 0, 0, 1.0)'            
}

      



See the fiddle for a complete example .

0


source







All Articles