signup.php 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190
  1. <!-- <link rel="stylesheet" href="/js/signup/signup.css"> -->
  2. <style>
  3. /*2018.7.26 明 移过来内页方便快速加载*/
  4. .Content{height:100%;}
  5. .m_signUp_box{z-index:1000;position:relative;}
  6. .m_signUp{border:1px solid;width:100%;height:100%;position: fixed;top:0;left:0;z-index:100;background-color:#000;opacity:0.3;}
  7. .m_form{width:85%;border-radius: 7px;position:absolute;left:50%;top:0;margin-left:-42.5%;z-index:110;overflow:hidden;background:#FFF;padding-bottom:30px;padding-top:45px;box-shadow:7px 7px 20px 0px rgba(70, 54, 54, 0.35);
  8. animation:change 0.4s;
  9. -webkit-animation:change 0.4s;
  10. -moz-animation:change 0.4s;
  11. -o-animation:change 0.4s;
  12. }
  13. @keyframes change {
  14. 0% {top:-100%;opacity:0;}
  15. 100% {opacity:1;}
  16. }
  17. -webkit-@keyframes change {
  18. 0% {top:-100%;opacity:0;}
  19. 100% {opacity:1;}
  20. }
  21. -moz-@keyframes change {
  22. 0% {top:-100%;opacity:0;}
  23. 100% {opacity:1;}
  24. }
  25. -o-@keyframes change {
  26. 0% {top:-100%;opacity:0;}
  27. 100% {opacity:1;}
  28. }
  29. .m_form_title_box{}
  30. .m_form_title{padding:0 30px;}
  31. .m_form_title span{font-size:1.5rem;color:#000;font-weight:600;}
  32. /*.m_form_title em{width:22%;height:1px;position:relative;background:#FFF;display:block;}
  33. .m_form_title em i{width:6px;height:6px;display:block;position:absolute;top:-2px;right:0;border-radius:50px;background:#FFF;}
  34. */
  35. .m_form_input{width:85%;height:44px;margin:auto;margin-bottom:15px;background:#EEE;border-radius:5px;margin-top:20px;}
  36. /*.m_form_input img{display: block;width:13px;margin-top:10px;float:left;margin-left:14px;}*/
  37. .m_form_input input{text-align:center;outline:none;background:#EEE;border-radius:5px;float:left;width:100%;height:60%;border:0;font-size:0.875rem;color:#00011E;margin-top:8px;}
  38. .m_button{outline:none;width:85%;height:45px;border:0;background:#D62F2F;border-radius:5px;margin:auto;display: block;margin-top:20px;font-size:1rem;color:#FFF;position:relative;z-index:100;}
  39. .y_fonr_text{font-size: 0.875rem; color: #999; width: 85%; margin: 0 auto; line-height: 20px;margin-top:15px;}
  40. .y_fonr_text i{color:#D62F2F;}
  41. .m_close{position:absolute;right:15px;top:15px;z-index:100;width:36px;width:15px;height:15px;
  42. animation:change 0.4s;
  43. -webkit-animation:change 0.4s;
  44. -moz-animation:change 0.4s;
  45. -o-animation:change 0.4s;
  46. }
  47. .m_close img{width:100%;display:block;}
  48. .m_form_input input:-webkit-input-placeholder {color: #999;}
  49. .m_form_input input:-moz-placeholder {color: #999;}
  50. .m_form_input input:-ms-input-placeholder {color: #999;}
  51. .m_form_input input:-o-input-placeholder {color: #999;}
  52. .m_form_input .cle {display:inline-block;width:15px;height:15px;position:absolute;top:11px;right:10px;display:none;}
  53. /*2020-1-3 首页新年特惠购房 报名弹窗*/
  54. .wbuen {height:377px;background:url('/image/v2/windex9_2_1.png') no-repeat center/282px 377px;padding-top:58%;overflow:inherit;}
  55. .wbuen .m_form_input {height:40px;border-radius:20px;margin-bottom:10px;position:relative; width: 75%;}
  56. .wbuen .m_button {height:40px;border-radius:20px;margin-top:15px;color:rgba(0,0,0,0);font-weight:bold; width: 75%;
  57. background: url('/image/v2/windex9_2_2.png') no-repeat; background-size:100% 100%;
  58. }
  59. .wbuen .m_form_input input {width:85%;margin-left:18px;text-align:left;padding-left:25px;}
  60. .wbuen .m_form_input .wtel {display:inline-block;position:absolute;top:11px;left:20px;width:13px;}
  61. .wbuen .m_close {top:auto;right:50%;width:26px;height:26px; bottom: -40px; margin-right:-13px;}
  62. /*2020-1-3 新春优惠更划算 报名弹窗*/
  63. .wbuens {height:350px;background:url(/image/v2/windex10_3.png) no-repeat center/313px 350px;padding-top:56%;overflow:inherit;}
  64. .wbuens .m_form_input {height:40px;border-radius:20px;margin-bottom:10px;position:relative; width: 75%;}
  65. .wbuens .m_button {height:40px;border-radius:20px;margin-top:15px;color:rgba(0,0,0,0);font-weight:bold; width: 75%;
  66. background: url('/image/v2/windex9_2_3.png') no-repeat; background-size:100% 100%;
  67. }
  68. .wbuens .m_form_input input {width:85%;margin-left:18px;text-align:left;padding-left:25px;}
  69. .wbuens .m_form_input .wtel {display:inline-block;position:absolute;top:11px;left:20px;width:13px;}
  70. .wbuens .m_close {top:auto;right:50%;width:26px;height:26px; bottom: -40px; margin-right:-13px;}
  71. </style>
  72. <div class="m_signUp_box">
  73. <!-- <div class="m_signUp"></div> -->
  74. <form class="m_form submit_area">
  75. <input type="hidden" name="hid" value="0"> <!-- 0 为公共报名,其它为楼盘ID-->
  76. <input type="hidden" name="source" value="3"> <!--报名来源 具体查看applyVerify.js文件中SourceModule 标识说明-->
  77. <input type="hidden" name="equipment" value="1"> <!--来源设备 ( PC端 2,手机端 1 )-->
  78. <div class="m_form_title_box">
  79. <div class="m_form_title">
  80. <!-- <em><i></i></em> -->
  81. <span>报名看房</span>
  82. <!-- <em><i style="left:0;"></i></em> -->
  83. </div>
  84. <div class="y_fonr_text"></div>
  85. </div>
  86. <div class="m_form_input c">
  87. <img class="cle" src="/image/w_cle.png" alt="">
  88. <input name="mobile" type="text" placeholder="您的手机号码">
  89. </div>
  90. <input type="button" value="立即报名" class="m_button apc_sbi">
  91. <div class="m_close"><img src="/image/v2/m_lpindex6.png" alt=""></div>
  92. </form>
  93. </div>
  94. <script>
  95. $(function(){
  96. // 修改页面适应样式
  97. var _height = $(window).outerHeight();
  98. var _h2 = $('.m_form').outerHeight();
  99. _h2 = Math.floor(_height/6);
  100. $('.m_signUp_box').css('height',_height);
  101. $('.m_form').css('margin-top',+_h2+'px');
  102. // 修改弹窗信息
  103. // $('.m_form_title').html(w_title);
  104. $('.m_form input[name="hid"]').val(w_id);
  105. $('.m_form input[name="source"]').val(w_module);
  106. $('.y_fonr_text').html(w_text);
  107. if(w_button){
  108. $('.m_form input[type="button"]').val(w_button);
  109. }
  110. // 输入清除显示与隐藏
  111. $('.m_form_input input[name="mobile"]').on('keyup',function(){
  112. var txt = $(this).val();
  113. if(txt != ''){
  114. $('.m_form_input .cle').show();
  115. }else{
  116. $('.m_form_input .cle').hide();
  117. }
  118. })
  119. // 清除功能
  120. $('.m_form_input .cle').on('click',function(){
  121. $('.m_form_input input[name="mobile"]').val('');
  122. $(this).hide();
  123. })
  124. $('.m_form_title span').html(w_title);
  125. console.log(w_title)
  126. // 2020-1-3 首页新年特惠购房
  127. if(w_title == '线上购房特惠中'){
  128. $('.m_form_title span').html('')
  129. $('form.m_form').addClass('wbuen');
  130. $('.wbuen .m_form_input').prepend('<img class="wtel" src="/image/v2/windex9_3.png" alt="">')
  131. $('.wbuen .m_close img').attr("src",'/image/v2/windex9_4.png');
  132. }
  133. // 2020-1-3 新春优惠更划算
  134. if(w_title == '房源动态订阅服务'){
  135. $('.m_form_title span').html('')
  136. $('form.m_form').addClass('wbuens');
  137. $('.wbuens .m_form_input').prepend('<img class="wtel" src="/image/v2/windex9_3.png" alt="">')
  138. $('.wbuens .m_close img').attr("src",'/image/v2/windex9_4.png');
  139. }
  140. // 删除
  141. $('.m_close').on('click',function(){
  142. $("body").off("click",'.apc_sbi');
  143. RemoveDiv();
  144. })
  145. //报名验证及提交的调用
  146. PublicAction.AjaxSend(
  147. {
  148. CORID:'apc_sbi', /*操作ID*/
  149. }
  150. );
  151. })
  152. </script>