API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Mar 18th, 2018
148
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 21.61 KB | None | 0 0
raw download clone embed print report
  1. <style>
  2. #_form_1_ { font-size:14px; line-height:1.6; font-family:arial, helvetica, sans-serif; margin:0; }
  3. #_form_1_ * { outline:0; }
  4. ._form_hide { display:none; visibility:hidden; }
  5. ._form_show { display:block; visibility:visible; }
  6. #_form_1_._form-top { top:0; }
  7. #_form_1_._form-bottom { bottom:0; }
  8. #_form_1_._form-left { left:0; }
  9. #_form_1_._form-right { right:0; }
  10. #_form_1_ input[type="text"],#_form_1_ input[type="date"],#_form_1_ textarea { padding:6px; height:auto; border:#979797 1px solid; border-radius:4px; color:#000 !important; font-size:13px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
  11. #_form_1_ textarea { resize:none; }
  12. #_form_1_ ._submit { -webkit-appearance:none; cursor:pointer; font-family:arial, sans-serif; font-size:14px; text-align:center; background:#333 !important; border:0 !important; -moz-border-radius:7px !important; -webkit-border-radius:7px !important; border-radius:7px !important; color:#fff !important; padding:12px !important; }
  13. #_form_1_ ._close-icon { cursor:pointer; background-image:url('https://d226aj4ao1t61q.cloudfront.net/esfkyjh1u_forms-close-dark.png'); background-repeat:no-repeat; background-size:14.2px 14.2px; position:absolute; display:block; top:11px; right:9px; overflow:hidden; width:16.2px; height:16.2px; }
  14. #_form_1_ ._close-icon:before { position:relative; }
  15. #_form_1_ ._form-body { margin-bottom:30px; }
  16. #_form_1_ ._form-image-left { width:150px; float:left; }
  17. #_form_1_ ._form-content-right { margin-left:164px; }
  18. #_form_1_ ._form-branding { color:#fff; font-size:10px; clear:both; text-align:left; margin-top:30px; font-weight:100; }
  19. #_form_1_ ._form-branding ._logo { display:block; width:130px; height:14px; margin-top:6px; background-image:url('https://d226aj4ao1t61q.cloudfront.net/hh9ujqgv5_aclogo_li.png'); background-size:130px auto; background-repeat:no-repeat; }
  20. #_form_1_ ._form-label,#_form_1_ ._form_element ._form-label { font-weight:bold; margin-bottom:5px; display:block; }
  21. #_form_1_._dark ._form-branding { color:#333; }
  22. #_form_1_._dark ._form-branding ._logo { background-image:url('https://d226aj4ao1t61q.cloudfront.net/jftq2c8s_aclogo_dk.png'); }
  23. #_form_1_ ._form_element { position:relative; margin-bottom:10px; font-size:0; max-width:100%; }
  24. #_form_1_ ._form_element * { font-size:14px; }
  25. #_form_1_ ._form_element._clear { clear:both; width:100%; float:none; }
  26. #_form_1_ ._form_element._clear:after { clear:left; }
  27. #_form_1_ ._form_element input[type="text"],#_form_1_ ._form_element input[type="date"],#_form_1_ ._form_element select,#_form_1_ ._form_element textarea:not(.g-recaptcha-response) { display:block; width:100%; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
  28. #_form_1_ ._field-wrapper { position:relative; }
  29. #_form_1_ ._inline-style { float:left; }
  30. #_form_1_ ._inline-style input[type="text"] { width:150px; }
  31. #_form_1_ ._inline-style:not(._clear) + ._inline-style:not(._clear) { margin-left:20px; }
  32. #_form_1_ ._form_element img._form-image { max-width:100%; }
  33. #_form_1_ ._clear-element { clear:left; }
  34. #_form_1_ ._full_width { width:100%; }
  35. #_form_1_ ._form_full_field { display:block; width:100%; margin-bottom:10px; }
  36. #_form_1_ input[type="text"]._has_error,#_form_1_ textarea._has_error { border:#f37c7b 1px solid; }
  37. #_form_1_ input[type="checkbox"]._has_error { outline:#f37c7b 1px solid; }
  38. #_form_1_ ._error { display:block; position:absolute; font-size:13px; z-index:10000001; }
  39. #_form_1_ ._error._above { padding-bottom:4px; top:-41px; right:0; }
  40. #_form_1_ ._error._below { padding-top:4px; top:100%; right:0; }
  41. #_form_1_ ._error._above ._error-arrow { bottom:0; right:15px; border-left:5px solid transparent; border-right:5px solid transparent; border-top:5px solid #f37c7b; }
  42. #_form_1_ ._error._below ._error-arrow { top:0; right:15px; border-left:5px solid transparent; border-right:5px solid transparent; border-bottom:5px solid #f37c7b; }
  43. #_form_1_ ._error-inner { padding:8px 12px; background-color:#f37c7b; font-size:13px; font-family:arial, sans-serif; color:#fff; text-align:center; text-decoration:none; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; }
  44. #_form_1_ ._error-inner._form_error { margin-bottom:5px; text-align:left; }
  45. #_form_1_ ._button-wrapper ._error-inner._form_error { position:static; }
  46. #_form_1_ ._error-inner._no_arrow { margin-bottom:10px; }
  47. #_form_1_ ._error-arrow { position:absolute; width:0; height:0; }
  48. #_form_1_ ._error-html { margin-bottom:10px; }
  49. .pika-single { z-index:10000001 !important; }
  50. @media all and (min-width:320px) and (max-width:667px) { ::-webkit-scrollbar { display:none; }
  51. #_form_1_ { margin:0; width:100%; min-width:100%; max-width:100%; box-sizing:border-box; }
  52. #_form_1_ * { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; font-size:1em; }
  53. #_form_1_ ._form-content { margin:0; width:100%; }
  54. #_form_1_ ._form-inner { display:block; min-width:100%; }
  55. #_form_1_ ._form-title,#_form_1_ ._inline-style { margin-top:0; margin-right:0; margin-left:0; }
  56. #_form_1_ ._form-title { font-size:1.2em; }
  57. #_form_1_ ._form_element { margin:0 0 20px; padding:0; width:100%; }
  58. #_form_1_ ._form-element,#_form_1_ ._inline-style,#_form_1_ input[type="text"],#_form_1_ label,#_form_1_ p,#_form_1_ textarea:not(.g-recaptcha-response) { float:none; display:block; width:100%; }
  59. #_form_1_ ._row._checkbox-radio label { display:inline; }
  60. #_form_1_ ._row,#_form_1_ p,#_form_1_ label { margin-bottom:0.7em; width:100%; }
  61. #_form_1_ ._row input[type="checkbox"],#_form_1_ ._row input[type="radio"] { margin:0 !important; vertical-align:middle !important; }
  62. #_form_1_ ._row input[type="checkbox"] + span label { display:inline; }
  63. #_form_1_ ._row span label { margin:0 !important; width:initial !important; vertical-align:middle !important; }
  64. #_form_1_ ._form-image { max-width:100%; height:auto !important; }
  65. #_form_1_ input[type="text"] { padding-left:10px; padding-right:10px; font-size:16px; line-height:1.3em; -webkit-appearance:none; }
  66. #_form_1_ input[type="radio"],#_form_1_ input[type="checkbox"] { display:inline-block; width:1.3em; height:1.3em; font-size:1em; margin:0 0.3em 0 0; vertical-align:baseline; }
  67. #_form_1_ button[type="submit"] { padding:20px; font-size:1.5em; }
  68. #_form_1_ ._inline-style { margin:20px 0 0 !important; }
  69. }
  70. #_form_1_ { position:relative; text-align:left; margin:25px auto 0; padding:20px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; *zoom:1; background:#fff !important; border:0px solid #b0b0b0 !important; width:500px; -moz-border-radius:0px !important; -webkit-border-radius:0px !important; border-radius:0px !important; color:#000 !important; }
  71. #_form_1_ ._form-title { font-size:22px; line-height:22px; font-weight:600; margin-bottom:0; }
  72. #_form_1_:before,#_form_1_:after { content:" "; display:table; }
  73. #_form_1_:after { clear:both; }
  74. #_form_1_._inline-style { width:auto; display:inline-block; }
  75. #_form_1_._inline-style input[type="text"],#_form_1_._inline-style input[type="date"] { padding:10px 12px; }
  76. #_form_1_._inline-style button._inline-style { position:relative; top:27px; }
  77. #_form_1_._inline-style p { margin:0; }
  78. #_form_1_._inline-style ._button-wrapper { position:relative; margin:27px 12.5px 0 20px; }
  79. #_form_1_ ._form-thank-you { position:relative; left:0; right:0; text-align:center; font-size:18px; }
  80. @media all and (min-width:320px) and (max-width:667px) { #_form_1_._inline-form._inline-style ._inline-style._button-wrapper { margin-top:20px !important; margin-left:0 !important; }
  81. }
  82. </style>
  83. <form method="POST" action="https://erikakrysiak.activehosted.com/proc.php" id="_form_1_" class="_form _form_1 _inline-form _dark" novalidate>
  84. <input type="hidden" name="u" value="1" />
  85. <input type="hidden" name="f" value="1" />
  86. <input type="hidden" name="s" />
  87. <input type="hidden" name="c" value="0" />
  88. <input type="hidden" name="m" value="0" />
  89. <input type="hidden" name="act" value="sub" />
  90. <input type="hidden" name="v" value="2" />
  91. <div class="_form-content">
  92. <div class="_form_element _x61708339 _full_width _clear" style="text-align: center;">
  93. <img class="_form-image" src="//erikakrysiak.img-us3.com/admin/yh4a6640.jpg" style="" />
  94. </div>
  95. <div class="_form_element _x18227868 _full_width _clear" >
  96. <div class="_form-title">
  97. Are we friends yet?
  98. </div>
  99. </div>
  100. <div class="_form_element _x95029397 _full_width _clear" >
  101. <div class="_html-code">
  102. <p>
  103. Subscribe to The Simple Fit Method to receive simple, doable and realistic tips you can use to simplify your health and fitness routine. And don't worry,
  104. I will never, EVER spam you. Only provide you support, love, and killer info so you can be the best version of you.
  105. </p>
  106. </div>
  107. </div>
  108. <div class="_form_element _x62725880 _full_width " >
  109. <label class="_form-label">
  110. Full Name
  111. </label>
  112. <div class="_field-wrapper">
  113. <input type="text" name="fullname" placeholder="Type your name" />
  114. </div>
  115. </div>
  116. <div class="_form_element _x48368801 _full_width " >
  117. <label class="_form-label">
  118. Email*
  119. </label>
  120. <div class="_field-wrapper">
  121. <input type="text" name="email" placeholder="Type your email" required/>
  122. </div>
  123. </div>
  124. <div class="_button-wrapper _full_width">
  125. <button id="_form_1_submit" class="_submit" type="submit">
  126. Yes, I need them!
  127. </button>
  128. </div>
  129. <div class="_clear-element">
  130. </div>
  131. </div>
  132. <div class="_form-thank-you" style="display:none;">
  133. </div>
  134. <div class="_form-branding">
  135. <div class="_marketing-by">
  136. Marketing by
  137. </div>
  138. <a href="http://www.activecampaign.com" class="_logo"></a>
  139. </div>
  140. </form><script type="text/javascript">
  141. window.cfields = [];
  142. window._show_thank_you = function(id, message, trackcmp_url) {
  143. var form = document.getElementById('_form_' + id + '_'), thank_you = form.querySelector('._form-thank-you');
  144. form.querySelector('._form-content').style.display = 'none';
  145. thank_you.innerHTML = message;
  146. thank_you.style.display = 'block';
  147. if (typeof(trackcmp_url) != 'undefined' && trackcmp_url) {
  148. // Site tracking URL to use after inline form submission.
  149. _load_script(trackcmp_url);
  150. }
  151. if (typeof window._form_callback !== 'undefined') window._form_callback(id);
  152. };
  153. window._show_error = function(id, message, html) {
  154. var form = document.getElementById('_form_' + id + '_'), err = document.createElement('div'), button = form.querySelector('button'), old_error = form.querySelector('._form_error');
  155. if (old_error) old_error.parentNode.removeChild(old_error);
  156. err.innerHTML = message;
  157. err.className = '_error-inner _form_error _no_arrow';
  158. var wrapper = document.createElement('div');
  159. wrapper.className = '_form-inner';
  160. wrapper.appendChild(err);
  161. button.parentNode.insertBefore(wrapper, button);
  162. document.querySelector('[id^="_form"][id$="_submit"]').disabled = false;
  163. if (html) {
  164. var div = document.createElement('div');
  165. div.className = '_error-html';
  166. div.innerHTML = html;
  167. err.appendChild(div);
  168. }
  169. };
  170. window._load_script = function(url, callback) {
  171. var head = document.querySelector('head'), script = document.createElement('script'), r = false;
  172. script.type = 'text/javascript';
  173. script.charset = 'utf-8';
  174. script.src = url;
  175. if (callback) {
  176. script.onload = script.onreadystatechange = function() {
  177. if (!r && (!this.readyState || this.readyState == 'complete')) {
  178. r = true;
  179. callback();
  180. }
  181. };
  182. }
  183. head.appendChild(script);
  184. };
  185. (function() {
  186. if (window.location.search.search("excludeform") !== -1) return false;
  187. var getCookie = function(name) {
  188. var match = document.cookie.match(new RegExp('(^|; )' + name + '=([^;]+)'));
  189. return match ? match[2] : null;
  190. }
  191. var setCookie = function(name, value) {
  192. var now = new Date();
  193. var time = now.getTime();
  194. var expireTime = time + 1000 * 60 * 60 * 24 * 365;
  195. now.setTime(expireTime);
  196. document.cookie = name + '=' + value + '; expires=' + now + ';path=/';
  197. }
  198. var addEvent = function(element, event, func) {
  199. if (element.addEventListener) {
  200. element.addEventListener(event, func);
  201. } else {
  202. var oldFunc = element['on' + event];
  203. element['on' + event] = function() {
  204. oldFunc.apply(this, arguments);
  205. func.apply(this, arguments);
  206. };
  207. }
  208. }
  209. var _removed = false;
  210. var form_to_submit = document.getElementById('_form_1_');
  211. var allInputs = form_to_submit.querySelectorAll('input, select, textarea'), tooltips = [], submitted = false;
  212.  
  213. var getUrlParam = function(name) {
  214. var regexStr = '[\?&]' + name + '=([^&#]*)';
  215. var results = new RegExp(regexStr, 'i').exec(window.location.href);
  216. return results != undefined ? decodeURIComponent(results[1]) : false;
  217. };
  218.  
  219. for (var i = 0; i < allInputs.length; i++) {
  220. var regexStr = "field\\[(\\d+)\\]";
  221. var results = new RegExp(regexStr).exec(allInputs[i].name);
  222. if (results != undefined) {
  223. allInputs[i].dataset.name = window.cfields[results[1]];
  224. } else {
  225. allInputs[i].dataset.name = allInputs[i].name;
  226. }
  227. var fieldVal = getUrlParam(allInputs[i].dataset.name);
  228.  
  229. if (fieldVal) {
  230. if (allInputs[i].type == "radio" || allInputs[i].type == "checkbox") {
  231. if (allInputs[i].value == fieldVal) {
  232. allInputs[i].checked = true;
  233. }
  234. } else {
  235. allInputs[i].value = fieldVal;
  236. }
  237. }
  238. }
  239.  
  240. var remove_tooltips = function() {
  241. for (var i = 0; i < tooltips.length; i++) {
  242. tooltips[i].tip.parentNode.removeChild(tooltips[i].tip);
  243. }
  244. tooltips = [];
  245. };
  246. var remove_tooltip = function(elem) {
  247. for (var i = 0; i < tooltips.length; i++) {
  248. if (tooltips[i].elem === elem) {
  249. tooltips[i].tip.parentNode.removeChild(tooltips[i].tip);
  250. tooltips.splice(i, 1);
  251. return;
  252. }
  253. }
  254. };
  255. var create_tooltip = function(elem, text) {
  256. var tooltip = document.createElement('div'), arrow = document.createElement('div'), inner = document.createElement('div'), new_tooltip = {};
  257. if (elem.type != 'radio' && elem.type != 'checkbox') {
  258. tooltip.className = '_error';
  259. arrow.className = '_error-arrow';
  260. inner.className = '_error-inner';
  261. inner.innerHTML = text;
  262. tooltip.appendChild(arrow);
  263. tooltip.appendChild(inner);
  264. elem.parentNode.appendChild(tooltip);
  265. } else {
  266. tooltip.className = '_error-inner _no_arrow';
  267. tooltip.innerHTML = text;
  268. elem.parentNode.insertBefore(tooltip, elem);
  269. new_tooltip.no_arrow = true;
  270. }
  271. new_tooltip.tip = tooltip;
  272. new_tooltip.elem = elem;
  273. tooltips.push(new_tooltip);
  274. return new_tooltip;
  275. };
  276. var resize_tooltip = function(tooltip) {
  277. var rect = tooltip.elem.getBoundingClientRect();
  278. var doc = document.documentElement, scrollPosition = rect.top - ((window.pageYOffset || doc.scrollTop) - (doc.clientTop || 0));
  279. if (scrollPosition < 40) {
  280. tooltip.tip.className = tooltip.tip.className.replace(/ ?(_above|_below) ?/g, '') + ' _below';
  281. } else {
  282. tooltip.tip.className = tooltip.tip.className.replace(/ ?(_above|_below) ?/g, '') + ' _above';
  283. }
  284. };
  285. var resize_tooltips = function() {
  286. if (_removed) return;
  287. for (var i = 0; i < tooltips.length; i++) {
  288. if (!tooltips[i].no_arrow) resize_tooltip(tooltips[i]);
  289. }
  290. };
  291. var validate_field = function(elem, remove) {
  292. var tooltip = null, value = elem.value, no_error = true;
  293. remove ? remove_tooltip(elem) : false;
  294. if (elem.type != 'checkbox') elem.className = elem.className.replace(/ ?_has_error ?/g, '');
  295. if (elem.getAttribute('required') !== null) {
  296. if (elem.type == 'radio' || (elem.type == 'checkbox' && /any/.test(elem.className))) {
  297. var elems = form_to_submit.elements[elem.name];
  298. if (!(elems instanceof NodeList || elems instanceof HTMLCollection) || elems.length <= 1) {
  299. no_error = elem.checked;
  300. }
  301. else {
  302. no_error = false;
  303. for (var i = 0; i < elems.length; i++) {
  304. if (elems[i].checked) no_error = true;
  305. }
  306. }
  307. if (!no_error) {
  308. tooltip = create_tooltip(elem, "Please select an option.");
  309. }
  310. } else if (elem.type =='checkbox') {
  311. var elems = form_to_submit.elements[elem.name], found = false, err = [];
  312. no_error = true;
  313. for (var i = 0; i < elems.length; i++) {
  314. if (elems[i].getAttribute('required') === null) continue;
  315. if (!found && elems[i] !== elem) return true;
  316. found = true;
  317. elems[i].className = elems[i].className.replace(/ ?_has_error ?/g, '');
  318. if (!elems[i].checked) {
  319. no_error = false;
  320. elems[i].className = elems[i].className + ' _has_error';
  321. err.push("Checking %s is required".replace("%s", elems[i].value));
  322. }
  323. }
  324. if (!no_error) {
  325. tooltip = create_tooltip(elem, err.join('<br/>'));
  326. }
  327. } else if (elem.tagName == 'SELECT') {
  328. var selected = true;
  329. if (elem.multiple) {
  330. selected = false;
  331. for (var i = 0; i < elem.options.length; i++) {
  332. if (elem.options[i].selected) {
  333. selected = true;
  334. break;
  335. }
  336. }
  337. } else {
  338. for (var i = 0; i < elem.options.length; i++) {
  339. if (elem.options[i].selected && !elem.options[i].value) {
  340. selected = false;
  341. }
  342. }
  343. }
  344. if (!selected) {
  345. elem.className = elem.className + ' _has_error';
  346. no_error = false;
  347. tooltip = create_tooltip(elem, "Please select an option.");
  348. }
  349. } else if (value === undefined || value === null || value === '') {
  350. elem.className = elem.className + ' _has_error';
  351. no_error = false;
  352. tooltip = create_tooltip(elem, "This field is required.");
  353. }
  354. }
  355. if (no_error && elem.name == 'email') {
  356. if (!value.match(/^[\+_a-z0-9-'&=]+(\.[\+_a-z0-9-']+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,})$/i)) {
  357. elem.className = elem.className + ' _has_error';
  358. no_error = false;
  359. tooltip = create_tooltip(elem, "Enter a valid email address.");
  360. }
  361. }
  362. if (no_error && /date_field/.test(elem.className)) {
  363. if (!value.match(/^\d\d\d\d-\d\d-\d\d$/)) {
  364. elem.className = elem.className + ' _has_error';
  365. no_error = false;
  366. tooltip = create_tooltip(elem, "Enter a valid date.");
  367. }
  368. }
  369. tooltip ? resize_tooltip(tooltip) : false;
  370. return no_error;
  371. };
  372. var needs_validate = function(el) {
  373. return el.name == 'email' || el.getAttribute('required') !== null;
  374. };
  375. var validate_form = function(e) {
  376. var err = form_to_submit.querySelector('._form_error'), no_error = true;
  377. if (!submitted) {
  378. submitted = true;
  379. for (var i = 0, len = allInputs.length; i < len; i++) {
  380. var input = allInputs[i];
  381. if (needs_validate(input)) {
  382. if (input.type == 'text') {
  383. addEvent(input, 'blur', function() {
  384. this.value = this.value.trim();
  385. validate_field(this, true);
  386. });
  387. addEvent(input, 'input', function() {
  388. validate_field(this, true);
  389. });
  390. } else if (input.type == 'radio' || input.type == 'checkbox') {
  391. (function(el) {
  392. var radios = form_to_submit.elements[el.name];
  393. for (var i = 0; i < radios.length; i++) {
  394. addEvent(radios[i], 'click', function() {
  395. validate_field(el, true);
  396. });
  397. }
  398. })(input);
  399. } else if (input.tagName == 'SELECT') {
  400. addEvent(input, 'change', function() {
  401. validate_field(this, true);
  402. });
  403. }
  404. }
  405. }
  406. }
  407. remove_tooltips();
  408. for (var i = 0, len = allInputs.length; i < len; i++) {
  409. var elem = allInputs[i];
  410. if (needs_validate(elem)) {
  411. if (elem.tagName.toLowerCase() !== "select") {
  412. elem.value = elem.value.trim();
  413. }
  414. validate_field(elem) ? true : no_error = false;
  415. }
  416. }
  417. if (!no_error && e) {
  418. e.preventDefault();
  419. }
  420. resize_tooltips();
  421. return no_error;
  422. };
  423. addEvent(window, 'resize', resize_tooltips);
  424. addEvent(window, 'scroll', resize_tooltips);
  425. window._old_serialize = null;
  426. if (typeof serialize !== 'undefined') window._old_serialize = window.serialize;
  427. _load_script("//d3rxaij56vjege.cloudfront.net/form-serialize/0.3/serialize.min.js", function() {
  428. window._form_serialize = window.serialize;
  429. if (window._old_serialize) window.serialize = window._old_serialize;
  430. });
  431. var form_submit = function(e) {
  432. e.preventDefault();
  433. if (validate_form()) {
  434. // use this trick to get the submit button & disable it using plain javascript
  435. document.querySelector('[id^="_form"][id$="_submit"]').disabled = true;
  436. var serialized = _form_serialize(document.getElementById('_form_1_'));
  437. var err = form_to_submit.querySelector('._form_error');
  438. err ? err.parentNode.removeChild(err) : false;
  439. _load_script('https://erikakrysiak.activehosted.com/proc.php?' + serialized + '&jsonp=true');
  440. }
  441. return false;
  442. };
  443. addEvent(form_to_submit, 'submit', form_submit);
  444. })();
  445.  
  446. </script>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!