How to make a popup modal/login box(?)

Code:

<script src="http://static.tumblr.com/hhedat8/OUkmkh864/script.js"></script>
<script src="http://static.tumblr.com/hhedat8/cfemkh9df/script.js"></script>
<link rel="stylesheet" href="http://static.tumblr.com/hhedat8/FpYmkhikx/chatbox.css"><div id="modal"><div id="content1">
<h3 style="background:#2c5687 url(http://community.invisionpower.com/filestore/public/style_images/master/maintitle.png) repeat-x top; font-size: 16px; padding: 8px 10px 9px; color: white; fon-family: Arial;">Σύνδεση</h3>
<center><br/>U need account? <a href="/register">Sign up now!</a><br/><br/>

<form action="/login" method="post" name="form_login"><div class="ipsForm ipsForm_horizontal">
<fieldset>
<ul><li class="ipsField ipsField_primary">
<label for="ips_username" class="ipsField_title">Usrename:</label><div class="ipsField_content">
<input id="ips_username" type="text" class="input_text" size="35" name="username" type="text"></div></li>
 
<li class="ipsField ipsField_primary">
<label for="ips_password" class="ipsField_title">Password:</label><div class="ipsField_content">
<input id="ips_password" type="password" class="input_text" name="password" size="35"<br></div></li>

<li class="ipsField ipsField_checkbox">
  <input class="radio" name="autologin" checked="checked" type="checkbox"><div class="ipsField_content"><label for="inline_remember"><strong>Remember me</strong><br><span>Not suggested for shared PCs</span>
</label></div></li></ul></fieldset>

  <div class="ipsForm_submit ipsForm_center">
<input class="mainoption" name="login" value="Loign" type="submit">
</div></div></form>


</div>
</div>

Code:

<!-- BEGIN switch_user_logged_out -->
            <div id="user_navigation" class="not_logged_in">
                    <ul class="ipsList_inline">
                      <li style="margin-right: 12px;"><a href="#" title="Loign" id="button">Login</a></li>
                      <li><a href="/register" title="Sig nup" id="register_link">Sign up</a></li>
                    </ul>
                </div>
            <!-- END switch_user_logged_out -->

Code:

<!--
 #region sign_in_popup -->
  <div id="document_modal" class="modal" style="width: 100%; height: 100%; position: fixed; top: 0px; left: 0px; z-index: 10000; opacity: 0.4; background-color: rgb(62, 62, 62);"></div>
  <div id="sign_in_popup_popup" style="z-index: 10001; top: 25%; left: 24%; position: fixed;" class="popupWrapper"><div id="sign_in_popup_inner" class="popupInner" style="width: 600px; max-height: 641px;"><div style="" class="ipbfs_login" id="inline_login_form"><form id="login" method="post" action="/login.forum"><h3>Login</h3><div class="ipbfs_login_row"><div class="ipbfs_login_col"><span class="right desc lighter blend_links"><a title="Registre-se agora!" href="/register">Register now!</a></span>    <div class="ipsField_content"><input type="text" tabindex="1" size="30" placeholder="Your Username" name="username" class="input_text ipbfs_login_input ipbfs_luser" id="ips_username"></div></div><div class="ipbfs_login_col"><span class="right desc lighter blend_links"><a title="Retrieve password" href="/profile?mode=sendpassword">Forgot Password ?</a></span><div class="ipsField_content"><input type="password" tabindex="2" size="30" placeholder="Your Password" name="password" class="input_text ipbfs_login_input ipbfs_lpassword" id="ips_password"><br></div></div></div><div class="clearfix"><div class="ipbfs_login_col"><input type="checkbox" class="input_check left" value="1" name="autologin" checked="checked" id="autologin"><div style="padding-left: 20px;"><label for="autologin"><strong>Remember me</strong><span style="display: block; padding-top: 5px;" class="desc lighter">This is not recommended for shared computers</span></label></div></div><div class="ipbfs_login_col"><input type="checkbox" class="input_check left" value="1" name="anonymous" id="anonymous"><div style="padding-left: 20px;"><label for="anonymous"><strong>Sign In Anonymously</strong><span style="display: block; padding-top: 5px;" class="desc lighter"> Don't add me to the active users list </span></label></div></div></div><div class="ipsForm_submit ipsForm_center clear" style="height: 29px;"><input type="submit" name="login" value="Sign In" class="input_submit"><input name="redirect" type="hidden" value=""></div></form></div></div><div id="sign_in_popup_close" class="popupClose clickable"><img alt="x" src="http://i78.servimg.com/u/f78/18/17/62/92/close_10.png" onclick="show_popup('sign_in_popup_popup');"></div></div>
    <script type="text/javascript">//<![CDATA[
$(document).ready(function() {$('#user_navigation #sign_in').attr('href', '#').attr('onclick', "show_popup('sign_in_popup_popup');");/*$('#user_navigation #sign_in').click(function() {sign_in_popup();});*/});function show_popup(id) {var $oObj = $('#'+id);if ($oObj.css('display') == 'none') {$oObj.add('#document_modal').fadeIn('slow');$("input:text:eq(0):visible").focus();} else {$oObj.add('#document_modal').fadeOut('slow');} }//]]></script>
    <style type="text/css"><!--
.popupWrapper {box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.5) !important;background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.6);padding: 8px !important;border-radius: 5px !important;}.ipbfs_login .ipsForm_submit {margin-top: 0;}.ipbfs_login .ipsBox_notice {margin: 0;}.ipbfs_login .input_submit {font-size: 13px;}#sign_in_popup_inner {width: 680px !important;}.popupInner {box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);overflow-x: hidden;overflow-y: auto;width: 500px;}.popupInner h3 {border-bottom: 1px solid #d8d8d8;text-shadow: 0 -1px 0 rgba(255, 255, 255, 0.8);background:#eee url("http://i56.servimg.com/u/f56/17/97/98/69/highli12.png") repeat-x 0 0 ;padding: 8px 10px 9px;                  }  .border, .statistics, .post_block, .ipsComment, .popupInner, .no_messages, .poll_question ol, .ipsBox_container, .ipsFloatingAction, .column_view .post_body {background: none repeat scroll 0 0 #fff;}.ipsBox_notice {line-height: 1.6;margin-bottom: 10px;padding: 10px;}.ipsBox_notice, .ipsBox_highlight {background: none repeat scroll 0 0 #F4FCFF;border-bottom: 1px solid #CAE9F5;}.ipbfs_login_row {overflow: hidden;}.ipbfs_login_row, .gallery_pane h2, .ipsBox_container .ipsType_pagetitle, .ipsType_sectiontitle, #index_stats .status_list:first-of-type li:first-child, .ipsList_data li:first-of-type, .ipsList_withminiphoto li:first-of-type, .ipsList_withmediumphoto li:first-of-type, .category_block table tr:nth-of-type(2) td {border-top: 0 none;}#recentajaxcontent li, #idm_categories a, #index_stats .status_list li, #panel_files .file_listing li, #panel_screenshots #ss_linked li, .file_listing, #cart_totals td, div#member_filters li, #files li, .ipsType_sectiontitle, #order_review td, #package_details .package_info, .block_list li, .package_view_top, .member_entry, #help_topics li, .ipsBox_container .ipsType_pagetitle, .userpopup dl, #announcements td, .preview_info, .sideVerticalList li, fieldset.with_subhead ul, .ipsList_data li, .ipsList_withminiphoto li, .ipsList_withmediumphoto li, table.ipb_table td, .store_categories li, #mini_cart li, #index_stats div[id*="statusReply"], #ipg_category .ipg_category_row, .gallery_pane h2, .status_feedback li[id*="statusReply"], .ipsSideMenu ul li, .ipbfs_login_row, .ipbfs_login .clearfix, .articles .block-1, .articles .type-1x2x2 .article_row, #idm_category .idm_category_row, #category_list li a, .ipsComment {border-bottom: 1px solid #E3E3E3;border-top: 1px solid #fff;}.ipbfs_login_col {float: left;padding: 15px 10px;width: 314px;}.desc.lighter, .desc.lighter.blend_links a {color: #646464;}.desc, .desc.blend_links a, p.posted_info {color: #898989;font-size: 11px;}.right {float: right;}.ipbfs_login_col a:hover {text-decoration: underline;}.ipbfs_login_row label {font-size: 1.15em;}input:-moz-placeholder {color: #939393;}.ipbfs_luser {background-image: url("http://i78.servimg.com/u/f78/18/17/62/92/user10.png") !important;background-position: 7px 60% !important;background-repeat: no-repeat !important;}.ipbfs_login_input {font-size: 14px !important;margin-top: 10px;padding: 6px 0 6px 28px !important;width: 284px;}.input_text, .ipsTagBox_wrapper, textarea {background: none repeat scroll 0 0 #FCFCFC;border: 1px solid #D4D4D4;box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset;color: #000;padding: 6px;text-shadow: #FFF 0px 1px 0px;}input, select, textarea {font: 12px tahoma,helvetica,arial,sans-serif;}.ipbfs_lpassword {background-image: url("http://i78.servimg.com/u/f78/18/17/62/92/key10.png");background-position: 7px 60% !important;background-repeat: no-repeat !important;}.clearfix:after {clear: both;content: ".";display: block;height: 0;overflow: hidden;visibility: hidden;}.left {float: left;}img, .input_check, .input_radio {vertical-align: middle;}.ipsForm_center {text-align: center !important;}.ipsForm_submit {margin-top: 25px;padding: 5px 10px;text-align: right;}.clear {clear: both;}#vnc_filter_popup_close, body#ipboard_body fieldset.submit, body#ipboard_body p.submit, .ipsForm_submit {background: #e4e4e4 url('http://i56.servimg.com/u/f56/17/97/98/69/highli12.png') repeat-x 0 0;border-top: 1px solid #d8d8d8;}.popupClose {position: absolute;right: 20px;top: 20px;}.clickable {cursor: pointer;}.input_submit, .ipsButton_secondary {outline: medium none;}.input_submit {background: #3c3c3c ;border-color: #333;box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3), 0px 1px 0px rgba(255, 255, 255, 0.13) inset;color: #FFF;text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.5);border-radius: 3px;}.input_submit {text-decoration: none;border-width: 1px;border-style: solid;padding: 5px 12px;cursor: pointer;}body {color: #5a5a5a !important;font: 12px tahoma,helvetica,arial,sans-serif !important;}--></style>
    <!--
 #endregion sign_in_popup -->

J0k3R^ wrote:[link="/t374-how-to-make-a-popup-modal-login-box#2378"]no!
did i say its solved?
has anyone posted a solution?.....

J0k3R^ wrote:[link="/t374-how-to-make-a-popup-modal-login-box#2383"]there is no response because "u dont allow bump topics" so i cant do something else to make u understand that its not solved yet. and i also leave new feedback if i solve it alone :)
so, dont lock this one, im still waiting to get solved.