Skip to content

Instantly share code, notes, and snippets.

View willwright82's full-sized avatar
👾
parsleybox.com

Will Wright willwright82

👾
parsleybox.com
12 followers · 13 following
View GitHub Profile
@willwright82
willwright82 / AreYouHuman
Created July 10, 2014 16:07
Are you human? Math captcha
<!DOCTYPE html>
<html lang="en">
<head>
<title>Are You Human?</title>
<script type="text/javascript">
var a = Math.ceil(Math.random() * 10);
var b = Math.ceil(Math.random() * 10);
var c = a + b
@willwright82
willwright82 / TrustPilotDynamicWidth
Created July 16, 2014 14:34
Trust Pilot iFrame Dynamic Width
<style type="text/css">
div.trust-pilot{
width: 100% !important;
height: auto;
}
</style>
<div id="trust-pilot" class="trust-pilot">
<div class="tp_-_box" data-tp-settings="domainId: xxxxxxx,
bgColor: F5F5F5,
@willwright82
willwright82 / ConditionalCSS
Created July 17, 2014 09:57
Conditional CSS
<!--[if lt IE 7]> <html class="ie6"> <![endif]-->
<!--[if IE 7]> <html class="ie7"> <![endif]-->
<!--[if IE 8]> <html class="ie8"> <![endif]-->
<!--[if gt IE 8]><!--> <html> <!--<![endif]-->
<style>
div.foo { color: inherit;}
.ie6 div.foo { color: #ff8000; }
</style>
@willwright82
willwright82 / Pull-Down
Created July 22, 2014 07:58
Pull-Down Function for bottom alignment
//for each element that is classed as 'pull-down', set its margin-top to the difference between its own height and the height of its parent
$('.pull-down').each(function() {
$(this).css('margin-top', $(this).parent().height()-$(this).height())
});
@willwright82
willwright82 / SmoothScroll
Last active August 29, 2015 14:04
Smooth Scroll
/* Smooth Scrolling */
$('a.scroll[href*=#]:not([href=#])').on('click', function(e) {
// prevent default anchor click behavior
target = this.hash;
e.preventDefault();
// animate
$('html, body').animate({
scrollTop: $(this.hash).offset().top - 60
}, 1000, function() {
// when done, add hash to url
@willwright82
willwright82 / SameHeightColumns.html
Last active June 27, 2016 11:39
Same Height Columns (One True Method)
<div id="one-true" class="group">
<div class="col">
<h3>I am listed first in source order.</h3>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
</div>
<div class="col">
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>
</div>
<div class="col">
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
@willwright82
willwright82 / SassSyntax
Created July 23, 2014 14:16
SASS basic syntax
/* Variables */
$font-stack: Helvetica, sans-serif
$primary-color: #333
body
font: 100% $font-stack
color: $primary-color
/* Nesting */
nav
@willwright82
willwright82 / AbsoluteCenter.html
Last active August 29, 2015 14:04
Absolute Center
<style>
div{
background: red;
bottom: 0;
height: 100px;
left: 0;
margin: auto;
position: absolute;
top: 0;
right: 0;
@willwright82
willwright82 / NegativeRounded
Created July 28, 2014 09:27
Negative Rounded Corners Menu
<ul class="selectable">
<li>
<dl>
<dd class="top"></dd>
<dt>Title</dt>
<dd class="bot"></dd>
</dl>
</li>
<li class="active">
<dl>
@willwright82
willwright82 / Bootstrap HTML Popover
Created August 26, 2014 14:12
Bootstrap HTML Popover
<script>
$("[data-toggle=popover]")
.popover({
html: true
})
</script>
<a href="#" role="button" class="btn popovers" data-toggle="popover" title="" data-content="test content <a href='' title='test add link'>link on content</a>" data-original-title="test title">test link</a>