transparent box

HI,

Please add below custom cs in your colrbox custom css filed –

#colorbox_main_container_939 .colorbox_singel_box:hover .wpsm_panel {
    background: rgba(239, 239, 239, 0.6) !important;
}
#colorbox_main_container_939 .colorbox_singel_box:hover .wpsm_panel-heading {
    background: rgba(239, 239, 239, 0) !important;
}
#colorbox_main_container_939 .colorbox_singel_box:hover .wpsm_panel-body {
    background: hsla(0, 0%, 94%, 0) !important;
}

Try it and then let me know.

Thanks

• This reply was modified 7 years, 6 months ago by wpshopmart.

Added that to the code I already have, but It did not do anything.

I have this code already, it will highlight the boxes:

#colorbox_main_container_939 .colorbox_singel_box:hover .wpsm_panel-body{
background:#efefef !important;
}

#colorbox_main_container_939 .colorbox_singel_box:hover .wpsm_panel-heading{
background:#efefef !important;
}
#colorbox_main_container_939 .colorbox_singel_box:hover .wpsm_panel{
background:#efefef !important;

But I also would like to have the transparent fix.

Btw, thank you for a very quick reply! ??

Edit, it DID work. I forgot a “}” between the old code and the new!

But it works the other way I intended. It is transparent only when mouse over, could we do it the other way? So it is 70% transparent first, and solid when mouse is over?

Ok tehn remove old one custom css then add this new one –

#colorbox_main_container_939 .wpsm_panel {
   background-color: rgba(255, 255, 255, 0.6) !important;
}
#colorbox_main_container_939 .wpsm_panel-default > .wpsm_panel-heading {
    background-color: transparent !important;
}
#colorbox_main_container_939 .wpsm_panel-body {
    background-color: transparent !important;
}