Magento 2 modal: Content is showing on page load

[RobertBett73e3]

I'm not sure what I'm doing wrong because I'm just using the official code from https://devdocs.magento.com/guides/v2.4/javascript-dev-guide/widgets/widget_modal.html/quickpayportal

The problem is, that content of the modal is shown for a few milliseconds on every page load/page change and then gets hidden. Modal itself works, though.

This can't be the expected behavior, so I'm wondering what I'm doing wrong.

Is there any CSS I have to use to prevent modal content to be shown on page load?

Thanks.

[AndySteeple]

I got around this by hiding the modal content div with css, then changing the visibility once the pop up occurs.

<style> .modal-body-content{visibility:hidden;} </style>

Then place:

$('.modal-body-content').css('visibility','visible');

after:

$('#modal').modal('openModal');

[MatildaCooe923]

---

@RobertBett73e3 wrote:

I'm not sure what I'm doing wrong because I'm just using the official code from https://devdocs.magento.com/guides/v2.4/javascript-dev-guide/widgets/widget_modal.html/quickpayportal

The problem is, that content of the modal is shown for a few milliseconds on every page load/page change and then gets hidden. Modal itself works, though.

This can't be the expected behavior, so I'm wondering what I'm doing wrong.

Is there any CSS I have to use to prevent modal content to be shown on page load?

Thanks. mycvshr

---

Moreover, page loading time is also important regarding search engine rankings. Fast-loading websites usually will be ranked higher in the SERPs. Thus, Magento 2 Speed Optimization is a step that every store owner should take to increase traffic and conversion rates.

[wallacemard0eb]

---

@MatildaCooe923 wrote:

---

@RobertBett73e3 wrote: Panorama Charter Spectrum

I'm not sure what I'm doing wrong because I'm just using the official code from https://devdocs.magento.com/guides/v2.4/javascript-dev-guide/widgets/widget_modal.html/quickpayportal

The problem is, that content of the modal is shown for a few milliseconds on every page load/page change and then gets hidden. Modal itself works, though.

This can't be the expected behavior, so I'm wondering what I'm doing wrong.

Is there any CSS I have to use to prevent modal content to be shown on page load?

Thanks. mycvshr

---

Moreover, page loading time is also important regarding search engine rankings. Fast-loading websites usually will be ranked higher in the SERPs. Thus, Magento 2 Speed Optimization is a step that every store owner should take to increase traffic and conversion rates.

---

Create module which is extended from Magento_Catalog module.Please refer this article for Module Creation.