Html5 Popup Window
- The Popup window is a child window. That will be used to get more interaction to the user.
- The popup window may trigger by an event or triggered by a specified time.
Sample coding for Html5 Popup Window
Code Explanation for Html5 Popup Window
- The External CSS style sheet file popup.css will be linked for apply styles to the popup window.
- The link to open the popup window.
- The popup window content will be place inside the <div> tag which has id attribute as openPopup.
- The close button of the popup window is defined in the <a> tag.
Sample coding for HTML5 Popup Window popup.css
Code Explanation for Html5 Popup Window subs-style.css
- The CSS styles to design popup window.
- The popup:target is used to show the popup window when the url target changed to #openPopup.
- The CSS styles to design popup <div> tag.
- The CSS style to design close button of the popup window.
- The CSS style to design close button hover event.
Output for Html5 Popup Window
- That the output shows Open Popup link.
- When user click the Open Popup link then the POPUP WINDOW will be displayed.
- The Close button is displayed Right corner of the popup window..
- When user click the close button then the popup window will be closed
Browser Support for Html5 Popup Window