Overlay color used within the block is overlaying other parts of page when viewed in Chrome
Permalink Browser Info Environment
Hi ,
I have a slight issue with Background image overlay add-on. When I use overlay background colour the same gets overlayed not only over the Background image but also over the all slide block parts which then influences slide background colour (if it is white).
This only happens when opening page in Chrome or Firefox/Mozilla in IE white background of the slide stays white.
Is there a way to override this in Chrome?
Regards,
Aleksandar
I have a slight issue with Background image overlay add-on. When I use overlay background colour the same gets overlayed not only over the Background image but also over the all slide block parts which then influences slide background colour (if it is white).
This only happens when opening page in Chrome or Firefox/Mozilla in IE white background of the slide stays white.
Is there a way to override this in Chrome?
Regards,
Aleksandar
Type: | Discussion |
---|---|
Status: | Resolved |
Sorry for the late reply but I did not receive any notification from the system regarding your reply and I was away for the last few weeks.
Well, what happens is that after I insert the add on on all pages only first page image is visible and on all of the rest of the pages instead of image I get white background. I have set up all pages, slides and other elements background colour to none (transparent) and I still get white background. I have cleared the Concrete5 cache.
I am using a custom theme - Long Story Short Parallax.
Link to the working site:http://novi.meridian-apr.hr
You can see that only first page image is visible. Oh yes, this ONLY happens in Chrome. In IE everything works as it should
Well, what happens is that after I insert the add on on all pages only first page image is visible and on all of the rest of the pages instead of image I get white background. I have set up all pages, slides and other elements background colour to none (transparent) and I still get white background. I have cleared the Concrete5 cache.
I am using a custom theme - Long Story Short Parallax.
Link to the working site:http://novi.meridian-apr.hr
You can see that only first page image is visible. Oh yes, this ONLY happens in Chrome. In IE everything works as it should
The problem is caused by the JavaScript parallax effect in the Long Story Short theme. This effect layers <div> tags, with an image or colored background, on top of the background image.
Example: no parallax effect - background image is visible
http://novi.meridian-apr.hr/index.php...
Example: parallax effect - background image is not visible
http://novi.meridian-apr.hr/index.php/services...
This is one of the "parallax blocks" that is layered on top of the background image. The div within it, with the class of "parallax-image", has a white background.
I did a quick check using different browsers.
Does work:
IE9 and IE11
Does not work:
Microsoft Edge
Chrome
Firefox
At this time, I would not recommend using this block when using the Long Story Short theme.
I have attached screenshots of the code to help explain how the parallax effect covers the background image.
Example: no parallax effect - background image is visible
http://novi.meridian-apr.hr/index.php...
Example: parallax effect - background image is not visible
http://novi.meridian-apr.hr/index.php/services...
This is one of the "parallax blocks" that is layered on top of the background image. The div within it, with the class of "parallax-image", has a white background.
<div class="parallax-block" style="width: 1253px; height: 513px; visibility: hidden;"> <div class="parallax-image" style="background-color: rgb(255, 255, 255); width: 1253px; height: 1253px; background-position: initial initial; background-repeat: initial initial;"></div> <span class="drop-shadow"></span> </div>
I did a quick check using different browsers.
Does work:
IE9 and IE11
Does not work:
Microsoft Edge
Chrome
Firefox
At this time, I would not recommend using this block when using the Long Story Short theme.
I have attached screenshots of the code to help explain how the parallax effect covers the background image.
A bit late reply from my side but I did neglect this project a bit.
Thank you for your help I might do it with parallax turned off.
So in order for both to work I would have to remove white background from the theme's code?
Thank you for your help I might do it with parallax turned off.
So in order for both to work I would have to remove white background from the theme's code?
I don't think the parallax effect and full screen background image can both work at the same time. The parallax effect images and background color sit on top of the background image.
The web page examples you provided have changed. They now appear to have parallax effect disabled. Without the parallax effect, the background is now visible.
The web page examples you provided have changed. They now appear to have parallax effect disabled. Without the parallax effect, the background is now visible.
Ah ok, I get it. No problem I will have to work around it then.
Yes I have turned off parallax in order to play with background images only for now.
Thank you for your help.
Yes I have turned off parallax in order to play with background images only for now.
Thank you for your help.
Are you using a custom theme?
Please include a link to a page where this is happening.