Ghada Abbes Posted July 2, 2020 Share Posted July 2, 2020 Hello I need to make a form in a popup, I need twopriority Controls (inputs fields) with a button. But my problem while moving to input to another to write the popup disappear ! I added this code for the popup with javascript. var $div = $("#" + id); var css = " .sf-element-bookmark-capture{ visibility: hidden; } .error { color: red; } .succes { color: green; } table.overview { width:100%; } table tr td.title { font-size: 22px; font-weight: bold; text-align: center; } table tr td.subtitle { font-size: 12px; font-style: italic; color: #999; text-align: center; } table tr td.logo { width: 175px; height: 75px; text-align: center; } .Popup { display: none; position: fixed; font-family: Microsoft JhengHei, Arial, Helvetica, sans-serif; font-size: 11px; z-index: 1; /* Sit on top */ padding-top: 100px; /* Location of the box */ left: 0; top: 0; right: 0; bottom: 0; width: 100%; /* Full width */ height: 100%; /* Full height */ /*overflow: auto; */ /* Enable scroll if needed */ overflow-y: auto; background: rgba(0,0,0,0.8); /*background-color: rgb(0,0,0);*/ /* Fallback color */ /*background-color: rgba(0,0,0,0.4);*/ /* Black w/ opacity */ } .PopupContent { width: 500px; background: #FFFFFF; margin: 5% auto; /* 5% from the top and centered */ padding: 5px 20px 13px 20px; border-radius: 10px; border: 1px solid #888; } .PopupOpen { } .PopupClose { background: #606061; line-height: 25px; position: relative; text-align: center; text-decoration: none; color: #fff; float: right; font-size: 28px; font-weight: bold; right: -12px; top: -10px; width: 24px; border-radius: 12px; vertical-align: middle; box-shadow: 1px 1px 3px #000; } .PopupOpen:hover, .PopupClose:hover, .PopupClose:focus { color: #00d9ff; text-decoration: none; cursor: pointer; } "; $("").text(css).appendTo($div); var modal = null; $(".PopupOpen").click(function(e){ e.preventDefault(); modal=document.getElementById(this.getAttribute('popupId')); modal.style.display="block"; }); $(".PopupClose").click(function() { modal.style.display = "none"; }); window.onclick = function(event) { if (event.target == modal) { modal.style.display = "none"; } } WITH the parameter id and valuestyle-container in the html : Anyone face the same problem can help me. Thanks Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now