Home › Community Forums › Aspire Theme Support › Problem with FullScreen Youtube video
- This topic has 8 replies, 2 voices, and was last updated 5 years, 1 month ago by
wpherc.
-
AuthorPosts
-
March 20, 2018 at 12:43 pm #22525
wpherc
CustomerHi,
I have that site with Aspire Pro installed on it.
Website: evaemergency.comI am trying to paste a youtube video on the frontpage as you can see it.
The problem is that when somebody click on the “full screen” option inside the youtube video, it does not work, it loads the screen but it is not visible.
I have tested disabling cache plugins, minification, etc, and it does not work.Can you please have a look and let me know where the problem could be?
I was able to determine that this css code is what is causing the issue.
/* Fadeup Effect ---------------------------------------------------------------------------------------------------- */ .js .fadeup-effect { opacity: 0; overflow: hidden; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } @-webkit-keyframes fadeInUp { from { opacity: 0; -webkit-transform: translateY(20px); } to { opacity: 1; -webkit-transform: translateY(0); } } @keyframes fadeInUp { from { opacity: 0; transform: translateY(20px); } to {opacity: 1;transform: translateY(0);} } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; }
Thanks!
March 21, 2018 at 11:43 am #22532Wes
ModeratorYeah I think I’ve ran into that issue a couple years ago, but I don’t remember what I did to fix it.
One of the things you could do is remove the fadeup effect from the front-page-3 widget area (since that’s the widget you’re using it in).
You can do this from the front-page.php file. Scroll until you see the front-page-3 section and remove the fadeup effect class. Make sure and do it from the FP3 widget only if you want to keep the effect on the other widgets.
I tested this while viewing your site and it worked. Let me know if that fixes it.
March 26, 2018 at 8:04 am #22540wpherc
CustomerHi Wes,
Thank you for your help.
What is the fadeup css for? My knowledge is limited on this topic. 🙂I will try to do this, but any further update on the theme will override that and generate the problem again, so I would like to have a better solution if it is possible.
Thanks
March 27, 2018 at 12:30 am #22541Wes
ModeratorThe fadeup effect is what you see when you visit the homepage. As you scroll down the widgets fade upwards slowly. Take a look at the Aspire demo to see what I’m referring to – http://demo.appfinite.net/aspire/
Notice when you load the page, all of the widget content (text and images) rise up in to their place? It only happens once. So in order to repeat it you would have to reload the page.
There are 3 ways to fix the issue. You could either adjust the code in the front-page.php file (looks like you’ve already done that), or you could edit your style.css.
I would recommend adding this to your Customizer > Additional CSS if you don’t want to edit any of the theme files –
.fadeInUp { -webkit-animation-name: none; animation-name: none; }
If you add that, then you shouldn’t have to worry about editing the front-page.php or style.css file (in case of any updates).
March 27, 2018 at 7:17 am #22542wpherc
CustomerThat seems a better option. Can we change this only for the widget 3?
Thanks
March 27, 2018 at 3:22 pm #22545Wes
ModeratorThis should work –
.front-page-3 .fadeInUp { -webkit-animation-name: none; animation-name: none; }
Add this to your Customizer > Additional CSS
March 28, 2018 at 12:07 pm #22546wpherc
CustomerThat didn´t work properly. It makes the whole space 3 dissapear.
I modify it adding it
opacity: initial !important;
And now it looks good.
Can you confirm that this change is ok?Thanks
March 28, 2018 at 4:20 pm #22548Wes
ModeratorIt worked when I tested it yesterday, not sure what’s missing in the code.
However, if
opacity: initial
works then I would just use that for now as long as no other issues show up. Either way should work fine.April 4, 2018 at 4:29 pm #22564wpherc
CustomerIt worked because I had changed the code on the theme files, not because of the css.
But is ok, it is working now.
Thank you for your help!
-
AuthorPosts
- You must be logged in to reply to this topic.