- How to add a modal/popup window in a website navigation menu created with AllWebMenus. view video
- How to add a modal/popup window in a web page using the "ID" attribute, applied to an "LI" tag. view video
- How to add a modal/popup window in a web page using the "onClick" mouse event, applied to an "IMG" tag. view video
- How to add a modal/popup window in a web page using the "ID" attribute, applied to an "A" tag. view video
- How to add a modal/popup window in a web page using the "Class" attribute, applied to an "IMG" tag. The modal/popup window source is an image. view video
Tags: ajax modal, ajax window, AllWebMenus, CSS, css popup, example, html popup, html window, javascript modal, jquery dialog, jquery modal, jquery popup, modal dialog, modal popup, modal window, window popup
Q:
When I open an external page in the modal window, I see the background color of the window's "Body Area" covering parts of the external page.
A:
Web-designers sometimes tend to forget assigning a background-color to their page if they want it to have a white background. This however is wrong and can have side-effects in some browsers and some cases.
Specifically if you load a page without background-color in an iframe, Google Chrome, Safari and Firefox will all treat the page background-color as transparent and will show the contents of the containing object behind the iframe. Internet Explorer and Opera on the other hand, will automatically set the page background to white.
In the case of Modal Windows, loading an external page that has no background-color will cause it (in the above specified browsers) to display the background-color you have set for the "Body Area" through the "Body CSS".
In this case we suggest that you either:
1) put a background-color in the <body> of the external page (preferred option)
2) put a white background to the modal window (through the "Body CSS" property)
Tags: background, Background color, jquery, jquery modal, jquery modal window