[ultimate_spacer height=”80″ height_on_tabs=”40″ height_on_tabs_portrait=”40″ height_on_mob_landscape=”30″ height_on_mob=”30″][ultimate_heading main_heading=”MODAL POPUP BOX” main_heading_font_family=”font_family:Lato|font_call:Lato|variant:300″ main_heading_style=”font-weight:300;” main_heading_font_size=”desktop:41px;” sub_heading_font_family=”font_family:Lato|font_call:Lato”]

WITH CSS3 ANIMATIONS

[/ultimate_heading][ultimate_spacer height=”30″ height_on_tabs=”20″ height_on_tabs_portrait=”20″ height_on_mob_landscape=”10″ height_on_mob=”10″][ultimate_modal icon_type=”selector” modal_title=”What is Modal Box? ” btn_size=”lg” btn_bg_color=”#a0cf4d” btn_txt_color=”#ffffff” btn_text=”TRY IT NOW” modal_style=”overlay-show-genie” overlay_bg_color=”#a0cf4d” overlay_bg_opacity=”80″ content_bg_color=”#f7f6fc” content_text_color=”#3c3837″ header_bg_color=”#333333″ header_text_color=”#ffffff” el_class=”modalslidebtn”]In user interface design, a modal window is a child window that requires users to interact with it before they can return to operating the parent application, thus preventing the workflow on the application main window. Modal windows are often called heavy windows or modal dialogs because the window is often used to display a dialog box.

Modal windows are commonly used in GUI systems to command user awareness and to display emergency states, although they have been argued to be ineffective for that use. Modal windows are prone to produce mode errors.[/ultimate_modal][ultimate_spacer height=”80″ height_on_tabs=”40″ height_on_tabs_portrait=”40″ height_on_mob_landscape=”30″ height_on_mob=”30″]

[ultimate_spacer height=”80″ height_on_tabs=”40″ height_on_tabs_portrait=”40″ height_on_mob_landscape=”30″ height_on_mob=”30″][ultimate_heading main_heading=” SUPPORTS EVERYTHING” main_heading_font_family=”font_family:Lato|font_call:Lato|variant:300″ main_heading_style=”font-weight:300;” main_heading_font_size=”desktop:41px;” sub_heading_font_family=”font_family:Lato|font_call:Lato”]

JUST PLACE YOUR STUFF IN WORDPRESS EDITOR AND START POPPING UP

[/ultimate_heading][ultimate_spacer height=”30″ height_on_tabs=”20″ height_on_tabs_portrait=”20″ height_on_mob_landscape=”10″ height_on_mob=”10″]

[ultimate_modal modal_title=”Popup with HTML Content” btn_size=”block” btn_bg_color=”#e67e22″ btn_txt_color=”#ffffff” btn_text=”Custom HTML” modal_size=”block” modal_style=”overlay-zoomin” overlay_bg_opacity=”80″ header_bg_color=”#e75353″ header_text_color=”#ffffff”]

we-build-logo

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed placerat rhoncus euismod. Mauris mollis tortor vitae placerat tincidunt. Donec tempus velit ut nisl blandit sollicitudin.

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aenean tincidunt aliquet velit sed ultrices. Vestibulum ante ipsum primis in

[/ultimate_modal]

[ultimate_modal modal_title=”Popup with Google Maps” btn_size=”block” btn_bg_color=”#e74c3c” btn_txt_color=”#ffffff” btn_text=”Google Maps” modal_style=”overlay-show-genie” overlay_bg_color=”#b8c74a” overlay_bg_opacity=”80″ header_bg_color=”#1e365a” header_text_color=”#ffffff”][/ultimate_modal]
[ultimate_modal modal_title=”Youtube Embed” modal_contain=”ult-vimeo” btn_size=”block” btn_bg_color=”#9b59b6″ btn_txt_color=”#ffffff” btn_text=”Embedded Video” modal_size=”block” modal_style=”overlay-show-boxes” overlay_bg_color=”#e94545″ overlay_bg_opacity=”80″ header_bg_color=”#e14f49″ header_text_color=”#ffffff”][/ultimate_modal]
[ultimate_modal modal_title=”Social Widgets” btn_size=”block” btn_txt_color=”#ffffff” btn_text=”Social Widgets” modal_size=”block” modal_style=”overlay-doorvertical” overlay_bg_opacity=”80″ header_bg_color=”#9ecf35″ header_text_color=”#ffffff”][/ultimate_modal]
[ultimate_modal modal_title=”Popup with Single Image” btn_size=”block” btn_bg_color=”#3498db” btn_txt_color=”#ffffff” btn_text=”Single Image” modal_size=”block” modal_style=”overlay-slidedown” overlay_bg_color=”#917a22″ overlay_bg_opacity=”80″ header_bg_color=”#f3d744″]7[/ultimate_modal]
[ultimate_modal modal_title=”WordPress Image Gallary” btn_size=”block” btn_bg_color=”#7f8c8d” btn_txt_color=”#ffffff” btn_text=”Image Gallery” modal_size=”block” modal_style=”overlay-slideup” overlay_bg_color=”#46a3d8″ overlay_bg_opacity=”80″ content_bg_color=”#ececec” header_bg_color=”#ececec” header_text_color=”#682d2d”]

[/ultimate_modal]

[ultimate_modal modal_title=”Popup with Image Slider Plugin” modal_contain=”ult-vimeo” btn_size=”block” btn_bg_color=”#34495e” btn_txt_color=”#ffffff” btn_text=”Image Slider” modal_size=”block” modal_style=”overlay-slideleft” overlay_bg_color=”#110068″ overlay_bg_opacity=”80″ content_bg_color=”#ececec” header_bg_color=”#e75353″ header_text_color=”#ffffff”]arhitectural[/ultimate_modal]
[ultimate_modal btn_size=”block” btn_bg_color=”#f1c40f” btn_txt_color=”#ffffff” btn_text=”Contact Form” modal_size=”block” modal_style=”overlay-show-cornershape” overlay_bg_color=”#ffd600″ overlay_bg_opacity=”80″ content_bg_color=”#2e3846″ content_text_color=”#ffffff” header_bg_color=”#9ecf35″ header_text_color=”#ffffff” modal_border_style=”dashed” modal_border_width=”2″ modal_border_color=”#ffffff” modal_border_radius=”4″][contact-form-7 id=”1391″ title=”Contact form 1″][/ultimate_modal]

Click on buttons above to see just a few possibilities of what could be done with modal pop-up.

[ultimate_spacer height=”80″ height_on_tabs=”40″ height_on_tabs_portrait=”40″ height_on_mob_landscape=”30″ height_on_mob=”30″]