*** SOLVED *** MODAL LAYER BACKGROUND NOT SHOWING IN ALL BUT DEFAULT VIEW PORT

[ColinM]

Hi Pablo,

Software Version - WYSIWG WB - 32 Bit - V 16.0.03 - 3 October 2020

a) I have a Client project.
b) There are 6 cards - one for for each event.
c) I have them in two 3 column layout grids.
d) That 3 column layout grid is in a superordinate single column layout grid.
e) c) is used so I can space the cards. with column (cell) padding.
f) Each event card has a More Information button.
g) In each of those event buttons I invoke the display of a modal layer for each event.

This works perfectly fine in the 1920 default viewport - but when I preview/FTP and view the 1588 and 1366 viewports - the contents of the modal layer shows but not the layer itself - that is, it is invisible?

I tried moving the cards into a non nested Layout Grid - but still had the same problem.

Extracted Project Elements:
1) webpage

2) Zipped Project Extract

[Pablo]

I could not load your project because it contains third party extensions.
Can you please remove all extensions and other content that is not relevant to your question?

Related FAQ:
https://www.wysiwygwebbuilder.com/forum ... 10&t=82134

[ColinM]

Hi Pablo,
Interesting - you've never had a problem downloading/viewing previous extracts and I haven't installed any more extensions - is that to do with WB16?

ANYWAY, How do I remove the third party extensions for you and keep them otherwise please?

[Pablo]

- save the project under a different name
- remove all pages except the one your question is about
- on the page, remove all script and extensions. Basically the page shoudl only content the elements that you are having an issue with.

[ColinM]

Yes, sorry, forgot to remove the other pages - working on it now...

[ColinM]

Hi Pablo,

OK try now

webpage

projectextract

[Pablo]

Thanks for the updated project. Now I was able to open it.

If you control elements via events (JavaScript) then the option 'include visibility' should be off. Otherwise there will have a conflict between CSS and JavaScript.

See also "When using events, the visibility is affected by breakpoints." i nthe FAQ:
https://www.wysiwygwebbuilder.com/forum ... 10&t=63817

[ColinM]

OK - our time differential means that I always get you at a long day

So I'm tired...

I've turned off the visibility in two of the modal layers via modal layer object > right click - untick Include Visibility (RWD) but the BG of the modal layer in the 1588 BP is still invisible?

[ColinM]

and why can I see the content of the modal layer and not the layer BG?

[Pablo]

I have tried it in your project and it works for me.

and why can I see the content of the modal layer and not the layer BG?

This is related to the way JavaScript show/hide work vs CSS visibility. See the FAQ.

[ColinM]

GOT IT!!!!!!

Of course I had to set that in the default view - OMG Pablo - your brain cavity must be a TARDIS to keep track of all of this!!!

[ColinM]

Thank you so much Pablo - your unlimited brain power saves the day once again!

Makes a lot of sense now I've digested it.