Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- html code
- <form id="text-popup" class="mfp-hide" action="http://cc.salesup-crm.com/PostOrder.aspx" method="post">
- <div class="cart">
- <div class="header">
- <h1 class="content-left">Оформление заказа</h1>
- <a class="content-right close mfp-close"></a>
- <div class="clear"></div>
- </div>
- <div class="left-wrap">
- <div class="left-b content-left">
- <p>
- <span>Имя</span>
- <input class="" name="name" id="client" type="text" value="" placeholder="Ваше имя и фамилия" required/>
- </p>
- <p>
- <span>Телефон <font title="Это поле обязательно для заполнения">*</font></span>
- <input class="input-phone" name="phone" id="phone" type="text" value="" placeholder="Ваш номер" required/>
- </p>
- <hr noshade="noshade">
- <button id="btn_done" type="submit" class="submit">Оформить заказ</button>
- <a class="del-link content-right" href="javascript: cartClear();">Очистить</a>
- </div>
- </div>
- <input name="comment" type="hidden" value="" />
- <input name="product_id" type="hidden" value="1579" />
- <input name="result_url" type="hidden" value="http://top-shopper.ru/camping-lights1/index2.html"/>
- <input name="referrer" type="hidden" value="" />
- <input name="order_url" type="hidden" value="" />
- <input name="transaction_id" type="hidden" value="0" />
- <input name="partner_id" type="hidden" value="0" />
- <input name="link_id" type="hidden" value="0" />
- </div>
- </form>
- Стилизация формы поп-апа
- @import url('http://fonts.googleapis.com/css?family=PT+Sans:400,700&subset=latin,cyrillic');
- a{
- cursor:pointer !important
- }
- .cart * {
- margin: 0;
- padding: 0;
- border: 0;
- outline: 0;
- font-weight: inherit;
- font-style: inherit;
- font-size: 100%;
- font-family: inherit;
- z-index: 99999;
- }
- .content-left{
- float:left;
- }
- .content-right{
- float:right;
- }
- .clear{
- clear:both;
- }
- .cart{
- box-sizing: border-box;
- width:100%;
- max-width: 449px;
- min-height: 312px;
- margin: 35px auto;
- border-radius: 2px;
- line-height: 1;
- color: #333;
- background-color: white;
- font-family: 'PT Sans',sans-serif;
- font-size: 14px;
- position: relative;
- z-index: 1000;
- }
- .cart .header{
- width: 100%;
- height: 69px;
- margin-bottom: 20px;
- background: url(data:image/gif;base64,R0lGODlhAQBFAPcAAPPz8/r6+vDw8Ozs7Pf39/Ly8vT09MspNO3t7erq6u7u7+bm5+/v8O/v7/Hx8e7u7vj4+PX19fv7++vr6+jo6Pz8/Pn5+enp6fb29ubm5v39/efn5/7+/v///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACwAAAAAAQBFAEcISwA7aAhAAACDARcycKhgIYKDBwk2HOiwUIIFCBgMFBCgAMGECxQ2ZKDIQYOGChIkBLhIAAOGCAYAFHAgoMEDBAMmTEgAMuSCDAcCAgA7) repeat-x;
- }
- .cart h1{
- color: #303030;
- font-size: 22px;
- text-transform: uppercase;
- margin-bottom: 10px;
- margin: 24px 0 0 22px;
- display: inline-block;
- font-weight: normal;
- display: inline-block;
- }
- .cart .header .close{
- background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAgCAYAAAAbifjMAAAA7klEQVR42p2T0RGEIAxEacEy7jtXgrXQgi3YAi3YylmLLSDeOE4Im0T42A+GfQssEH6fb2CaxBhp5mMJ70XJgGNR5h4JZ2kAcOVBMAqJYP7S6hmSMXcUUXixigrLEt+GPDAK8EIqeCRgk/6RIyQtoKfE5iFZV7VYIeEuxStMWyBqO2jatp6yNCDY/UzcQF3fmYi4JjFGmvlYwntRMuBYlLlHwlkaAFx5EIxCIpi/tHqGZMwd5GzR0h+WJb4NeWAU4IVU8EjAJv0jR0haQE+JzUOyrmqxQsJdileYtkDUdtC0bT1laUCw+5m4gXq+8wlQBsLHurM2ggAAAABJRU5ErkJggg==) no-repeat left top;
- height: 16px;
- width: 16px;
- text-indent: -9999px;
- margin: 27px 27px 0 0;
- }
- .cart .header .close:hover{
- background-position:left bottom;
- }
- .cart .left {
- margin: 0 auto;
- }
- .cart .left .left-b{
- background-color: #fbfbfb;
- padding: 17px 16px 14px 20px;
- border: 1px solid #f4f4f4;
- border-radius: 4px;
- min-height: 208px;
- display: inline-block;
- width: 100%;
- }
- .cart .left .left-b p{
- margin-bottom: 13px;
- }
- .cart .left .left-b p span{
- width: 107px;
- line-height: 38px;
- float: left;
- }
- .cart .left .left-b p input{
- background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQwAAAAqCAYAAABGDmUMAAABp0lEQVR42u3dMWoiYRjH4TlDjrHnsc0lAgt7i1gmldhaeAALewsbi1SKFgGLQWuR4LvfayZkMgnJNlvN88AfnCk/+H5MZxUR1dvqur4pG5QNy5ZlYWa927JpwKBpQrbh2oh2LH6XPTssM2vtuWnDezDKw4ODMbNv9nANRvlx6zDM7B92m8F4bL/c7XYxm81iMpnEaDSK8XhsZj1Z3vm8+9mAbEEnGI8ZjKf2y+l0GvP5PFarVazX69hut2bWk+Wdz7ufDcgWdILxVHU/OxaLRRwOhzidTnG5XALoj7zzefezAdmCbh8+BWOz2QgFCMe1BT8GIz9LALIFggEIBiAYgGAAggEIBiAYggEIBiAYgGAAggEIBiAYggEIBiAYgGAAggEIBiAYTgoQDEAwAMEABAMQDEAwAMEQDEAwgP8cjGU3GP6MGfotG/BFMJYZjGH75X6/j+PxGOfz2alBD+XdzwZkCzrBGGYwBt3PDjOzLzaoSlAyGvcOw8y+2X224hqMJhp/yl4cjJm19tK0ofoQjCYav8ruyqb1Kwdm1r/VTQPumiZUb8H4C7IfRaoW7Wh+AAAAAElFTkSuQmCC) no-repeat;
- height: 42px;
- width: 279px;
- padding-left: 15px;
- border: none;
- /* width: 80%; */
- }
- .cart .left .left-b div.select-wrapper{
- background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQYAAAAkCAYAAABrJpS1AAABx0lEQVR42u3dO2rjYBSGYeEFDHgRSTPpU9gJ02RrWoPTZAkDNm7DlPYKgnGjGBe+3++3OdGXaA4MwRBDKuk1PEYITvPD/6ILxkEYhrl6vX7dbDYfoyh6abfbBiBbtPfVALVATQjir3yr1XqdzWa23W7tdDoByBjtfTVALVATFIab3W7H4gAwtUBNUBjujsejAYCoCQrDr8PhYAAgasJ7GPb7vQGAEAYA58OgBw4AkDx8/AiDXlUAgHgYNpuNAYB4GNbrtQGAeBhWq5UBgHgYlsulAYB4GBaLhQGAeBjm87kBgHgY9KsqAOlQLBYtCIL/6NxX5z0M0+nUAKRDtVr9FAad++q8h2EymRiA9CgUCh4FHV8y62EYj8cGID0qlYqHQceXzHoYRqORAUgXXSnIpXMehuFwaADSpVwuv7t0zsMwGAwMAMTD0O/3DQCEMAA4H4Zer2cAIB6GbrdrACCEAcD5MHQ6HQMAIQwACAMAwgCAMAD4zjDcNRqNGQsCQC3496e2P0ul0lOtVltEUfSXxQGyR3tfDVAL1ASFIR97CD8+v2PPsT8AMuM52fth0oK8wpCL/YhdxW5j97rHAJAZ98nev0pakHsDleTd0l7zrNoAAAAASUVORK5CYII=) no-repeat;
- width: 263px;
- height: 36px;
- overflow: hidden;
- display: block;
- }
- .cart .left .left-b span font{
- color: #FF0000;
- }
- .cart .left .left-b textarea{
- background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQwAAABICAYAAAADMstdAAAB8UlEQVR42u3WMWoiYRjH4TnDHmPPY5tLBBb2FrFMKrG18AAW9hY2FqkULQIWg9YiYd79XjMhs7Mhm36eB/6QWL7w/ZgqIqr31XX9o2xUNi5bl4WZDW7rtgGjtgnZhlsjurH4VfbiWGbW2Uvbho9glH8eHcbMvtjjLRjljzvHMLNv7C6D8dT98XA4xGKxiNlsFpPJJKbTqZkNZPnm8+1nA7IFvWA8ZTCeuz/O5/NYLpex2Wxiu93Gfr83s4Es33y+/WxAtqAXjOeq/9mxWq3idDrF5XKJpmkCGI588/n2swHZgn4f/gnGbrcTChCOWwv+G4z8LAHIFggGIBiAYACCAQgGIBiAYAgGIBiAYACCAQgGIBiAYAgGIBiAYACCAQgGIBiAYLgUIBiAYACCAQgGIBiAYACCIRiAYACCAQgGIBiAYACCIRiAYACCAQgGIBiAYACCIRiAYACCAQgGIBiAYACCAQiGYACCAQgGIBiAYACCAQiGYACCAQgGIBiAYACCAQiGYADfCMa6H4ymaVwLBiwb8Ekw1hmMcffH4/EY5/M5rterq8EA5dvPBmQLesEYZzBG/c8OM7NPNqpKUDIaD45hZl/sIVtxC0Ybjd9lrw5jZp29tm2o/gpGG42fZfdl8/qNg5kNb3XbgPu2CdV7MP4A4VwgnS0zYhwAAAAASUVORK5CYII=) no-repeat;
- margin: 0px;
- padding: 12px 15px;
- border: none;
- resize:none;
- width: 268px;
- height: 71px;
- box-sizing: border-box;
- }
- .cart .left .left-b hr{
- color: #e1e1e1; /*??? IE */
- background-color:#e1e1e1; /*??? Firefox, Opera, Safari*/
- border:0px none;
- height:1px; /* ?????? 1px IE, Firefox, Opera, Safari */
- }
- .cart .left .left-b a.del-link{
- background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAAYCAYAAAAs7gcTAAAAiElEQVR42p2R0Q3AIAhEXcEx+k1ncidnqrO4AqWNJqhHgpq8RMDDU8Jz3aER1X7mr/UgC8UQkFCFpAMGgqEGk02w5ILVBd1m+WNk6/iw24b7gdtf5x6Kf9xE1IlqP/PXepCFYgi+VYWkAwaCoQaTTbDkgtUF3Wb5Y2Tr+LDbhvuB21/nHop73C9b8Epk+xL6KwAAAABJRU5ErkJggg==) no-repeat left top;
- height: 12px;
- color: #303030;
- font-size: 13px;
- text-decoration: none;
- padding-left: 20px;
- margin-top: 30px;
- margin-right: 10px;
- }
- .cart .left .left-b a.del-link:hover{
- background-position: left bottom;
- }
- .cart .left .left-b button{
- background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKEAAABUCAYAAADqDlccAAACY0lEQVR42u3dsU5TYRjHYSK7YeMOgFML0dPTRBBoKS4mDk6OXhA3YMKEiaNGJUEXiJqImLjp5qCDWhLcGAgRAb9XWxp2eg7DM/xu4J8nOTnL947U6/WR1JWHtRtTb7LGxk5W7H3MilNpGIWvcBbewl346wOc+5AV+0ZSWYW31Vq+kPyNBsKxl1lj2zAqu1dZYyf8BcLJ91lxaBRV8Gn+nfxNBcJZg6iqwl8gbBlDFSJsBcK2MVQhwjaEglAQQigIBSGEglAQQigIBSGEglAQQigIBSGEglAQQigIBSGEglAQQigIBSGEglAQQigIBSGEglAQQigIBSGEuhQIW++y4sggKrvtrPjTfxpu9nEt7xpFZZfc7fYfyZy8f21m7W3WODaMyiq8JXeP+s8Fj6Xu3a5Pr6/W8oOtrHFiJA2r8BXOwlu46z+cPpoaT91NraSepTZTr6ULbrPna6Xnbbx/QmKkd9TkamoidTO1GH8t0gW32PM10fN2dkznH8Kn+fzU12Jpo9vs7P1qLp9Kwyh8hbPwdu6i05P81txuc3nfSCqr8PY8nx9cdPpUtLcNo7L7XLQHF51+NjuHRlEFn+bBRSeDqKrOLjoZQxUi/H/RyRiqEGEbQkEoCCEUhIIQQkEoCCEUhIIQQkEoCCEUhIIQQkEoCCEUhIIQQkEoCCEUhIIQQkEoCCEUhIIQQkEoCCEUhIIQQl0KhK3vzc6RQVR2P5qdwUWnrcZC1ygqu83GwuCi04OZfO1b0Tk2jMoqvCV35y863Zm+vv4inz/4UiydGEnDKnyFs/DmopNcdJKLTv1jOn8BtoaGbNJ/PNEAAAAASUVORK5CYII=) no-repeat left top;
- color: #fff;
- font-size: 16px;
- height: 42px;
- width: 161px;
- padding-left: 0;
- cursor: pointer;
- margin-top: 15px;
- }
- .cart .left .left-b button:hover{
- background-position: left bottom;
- }
- /*FIREFOX CSS HACK*/
- @-moz-document url-prefix() {
- .cart, .cart .left .left-block textarea, .cart .right-block ul.cart-ul li .info .arrow-block{
- -moz-box-sizing: border-box;
- }
- }
- /*EOF FIREFOX CSS HACK*/
- /*JS формы очистки и проверки полей*/
- <script type="text/javascript">
- function cartClose() {
- window.top.postMessage('close-iframe', '*');
- }
- function cartTelCheck(id, show_errors)
- {
- var div = document.getElementById(id) || null;
- if (div == null)
- return true;
- var phone = (div.value || '').replace(/[^0-9]+/, '');
- var phoneLen = phone.length || 0;
- if (phoneLen < 5 || typeof phone != 'string') {
- if (show_errors == true) {
- alert("Укажите корректный номер телефона.");
- }
- return false;
- }
- return true;
- }
- function cartClear() {
- if (window.confirm("Действительно очистить?")) {
- document.getElementById('phone').value = '';
- document.getElementById('client').value = '';
- }
- }
- function cartTime() {
- return (new Date().getTime()) || 0;
- }
- function pastedData() {
- var land_forms = document.getElementsByTagName('form');
- for (var k = 0; k < land_forms.length; k++) {
- land_forms[k].action = land_forms[k].action + '©paste=1';
- }
- }
- </script>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement