Skip to content

Instantly share code, notes, and snippets.

Noah noahub

  • Unbounce
  • Vancouver, BC
Block or report user

Report or block noahub

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@noahub
noahub / particle.js
Last active Jan 25, 2018
Add Particle.js to page section
View particle.js
<script src="https://cdn.jsdelivr.net/npm/particles.js@2.0.0/particles.min.js"></script>
<script>
var section = "#lp-pom-block-8";
$(section).prepend('<div id="particle-js"></div>');
particlesJS.load('particle-js', "https://cdn.jsdelivr.net/npm/particles.js@2.0.0/demo/particles.json", function() {
console.log('callback - particles.js config loaded');
});
</script>
@noahub
noahub / 1-confetti.js
Last active Feb 8, 2018
Add Confetti on Form Submission
View 1-confetti.js
<script>
$(document).ready(function(){$('#ubpoverlay-overlay').append('<canvas id="world"></canvas>'),function(){var d,f,g,k,l,m,n,o,p,q,s,t;g=350,d=[[85,71,106],[174,61,99],[219,56,83],[244,92,68],[248,182,70]],k=2*Math.PI,l=document.getElementById('world'),n=l.getContext('2d'),window.w=window.innerWidth,window.h=window.innerHeight,s=function(){return window.w=l.width=window.innerWidth,window.h=l.height=window.innerHeight},window.addEventListener('resize',s,!1),window.onload=function(){return setTimeout(s,0)},q=function(u,v){return(v-u)*Math.random()+u},o=function(u,v,z,A){return n.beginPath(),n.arc(u,v,z,0,k,!1),n.fillStyle=A,n.fill()},t=0.5,document.onmousemove=function(u){return t=u.pageX/w},window.requestAnimationFrame=function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame||function(u){return window.setTimeout(u,1e3/60)}}(),f=function(){function u(){this.style=d[~~q(0,5)],this.rgb='
@noahub
noahub / input_types.js
Last active Aug 17, 2018
Change Form Field Input Types
View input_types.js
<script>
window.onload = function() {
//set up input styling
var newStyle;
getInputStyle();
//Use the setType function to update the input type. First parameter is input name, second is the input type.
setType("phone","tel");
setType("email","email");
setType("date","date");
setType("phone","tel");
@noahub
noahub / angled_sections.css
Created Jul 17, 2017
Angled Page Sections
View angled_sections.css
<style>
/*This ensures diagonal bg doesn't block page content*/
.lp-positioned-content{
z-index: 100;
}
/*Replace #lp-pom-block-34 with your section ID to create an angled bottom*/
#lp-pom-block-34:after{
background: inherit;
bottom: 0;
content: '';
@noahub
noahub / ga_named_tracker.js
Created Jul 12, 2017
GA Integration with Named Tracker
View ga_named_tracker.js
<script type='text/javascript'>
/* globals lp, ga, $ */
(function() {
var EventTracker, lpScriptVersion;
lpScriptVersion = '1.4.1';
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
View custome_email_template.html
<style>
*{font-family:"Open Sans", Helvetica, Arial, sans-serif;}
table { text-align: left; margin: 10px auto !important;}
/*Cell padding*/
table td, table th{ padding: 15px 10px !important; }
/*Header styling*/
table tr:first-child > th{ border: none;background:#00557F !important;color:#FFFFFF !important; font-size: 15px; font-weight: bold;}
/*Fields column*/
table tr:not(:first-child) > th{background:#E1EEF4 !important;}
td{background:#fff !important;}
@noahub
noahub / full_height.js
Created Jul 6, 2017
Full Height Section
View full_height.js
<script>
//Replace this ID with the full height section ID
var sectionId = "#lp-pom-block-8";
//box
var section = document.querySelector(sectionId);
var sectionChildren = section.children;
var otherContent = $('.lp-positioned-content').children();
var builderHeight = $(sectionId).height();
//find initial box height
var initHeight = builderHeight;
@noahub
noahub / count_to_date.js
Last active Nov 21, 2018
Add a Countdown to a Date
View count_to_date.js
<script>
countdown('06/26/2017 8:00 PM', 'timer'); //date format: mm/dd/yyyy hh:mm AM
function countdown(dt, id)
{
var end = new Date(dt);
var _second = 1000;
var _minute = _second * 60;
var _hour = _minute * 60;
var _day = _hour * 24;
@noahub
noahub / inline_errors.css
Last active Jul 21, 2019
Inline Form Errors
View inline_errors.css
<style>
/*Error text styling*/
.errorSpan{
color: red;
float: right;
font-family: inherit;
position: absolute;
bottom: -20px;
right: 0px;
font-size: .85em;
@noahub
noahub / form_submit.js
Last active Nov 28, 2018
Fire Code on Form Submission
View form_submit.js
<script type="text/javascript">
//runs on form submission
function yourSubmitFunction(e, $) {
e.preventDefault();
try {
//ADD CUSTOM CODE HERE
}
catch(err) {
//code to handle errors. console.log is just an example
console.log(err);
You can’t perform that action at this time.