Joomla Templates Club 406,261 posts

[suzanna Friend suzannaJoin date: August 2014Posts: 215Downloads:63Uploads:26 Thanks: 75 Thanked: 1 times in 1 posts]

#966434

Is it possible to set video opacity to 0 or no background color for an individual video that’s in parallax on the front page?

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#966449

Hi

Could you share here a link to the page where you published this video ?

[suzanna Friend suzannaJoin date: August 2014Posts: 215Downloads:63Uploads:26 Thanks: 75 Thanked: 1 times in 1 posts]

#966855

I’m too shy to show my site. It’s not ready yet. However, the template has the same video and video-mask. Once you click on the little play button the alpha filter opacity goes to zero.

Here is the front page with opacity set at 60 and then clicking removes it. I would like to see the video all the time without that opacity layer on top.

I just want the opacity removed on this one video (by adding special class perhaps?)

.acm-hero.style-4 .video-wrapper:before {
    content: "";
    position: absolute;
    background-color: #039be5;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    opacity: 0.6;
    filter: alpha(opacity=60);
    -webkit-transition: opacity 1.5s;
    -o-transition: opacity 0.5s;
    transition: opacity 0.5s;
}

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#967087

Hi

Add this to your custom.css file in this folder /templates/uber/css/

.acm-hero.style-4 .video-wrapper:before {
  opacity:0!important;
}

If you do not have already a custom.css file then create a new one

Regards

[suzanna Friend suzannaJoin date: August 2014Posts: 215Downloads:63Uploads:26 Thanks: 75 Thanked: 1 times in 1 posts]

#967132

Yes, but I just want one video with no opacity, not all hero style4 videos. Just one, on one page.

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#967178

You can create a custom class suffix in this way

.noopac .acm-hero.style-4 .video-wrapper:before {
  opacity:0!important;
}

Then add the suffix noopac to your single hero module in advanced tab

remember to add an empty space before noopac suffix

---

Attachments:

1. 

[Author]

Posts