Horizontal form layouts.html

<script>

  // unbounce-horizontal-forms 12-06-2014

  function HorizontalForm(a,b){this.spacing=a,this.submitPlacement=b,this.form=$(".lp-pom-form").eq(0),this.fields=$("div.lp-pom-form-field"),this.button=$(".lp-pom-form .lp-pom-button").eq(0),"manual"!==this.submitPlacement&&(this.fields=this.fields.add(this.button));var c=this;lp.jQuery(function(){c.layout()}),lp.jQuery(window).resize(function(){c.layout()})}HorizontalForm.prototype.layout=function(){for(var a=this.fields.eq(0).width()+this.spacing,b=this.fields.eq(0).height(),c=$(".lp-pom-block").eq(0).width()-this.form.position().left,d=0,e=0,f=1;f<this.fields.length;f++){field=this.fields.eq(f),e+=a,e+a>c&&(d=d+b+this.spacing,e=0,b=field.height());var g=d;field.is(".lp-pom-button")?"newline"===this.submitPlacement?(g=d+b+spacing,e=0):(g=d+19,field.css("height","32px")):$(field).children("label").length||(g=d+19),field.css({top:g+"px",left:e+"px"}),field.height()>b&&(b=field.height())}this.form.css({right:"0",width:"auto",height:d+b+"px"})};

  // First parameter is spacing between fields
  // Second parameter is submit button placement. Options:
  //    - 'inline': in line with the fields
  //    - 'newline': on a new line
  //    - 'manual': wherever you place the button in the page builder
  new HorizontalForm(20, 'inline');

</script>