This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* Relatively-position elements only fire events where they're actually painted | |
*/ | |
body { | |
background: #f06; | |
background: linear-gradient(45deg, #f06, yellow); | |
min-height: 100%; | |
} | |
.relative { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// jQuery plugin to scroll to an element on the page | |
// Usage: $('#someElement').scrollTo(); | |
// or: $('#someElement').scrollTo(750); | |
(function($) | |
{ | |
var $window = $(window), | |
$document = $(document), | |
$documentWrapper = $('body, html'); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// HELPER: #key_value | |
// | |
// Usage: {{#key_value obj}} Key: {{key}} // Value: {{value}} {{/key_value}} | |
// | |
// Iterate over an object, setting 'key' and 'value' for each property in | |
// the object. | |
Handlebars.registerHelper("key_value", function(obj, options) { | |
var buffer = "", | |
key; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* CSS Pac-Man */ | |
#pacman { | |
width: 1px; | |
height: 1px; | |
border: 60px solid red; | |
border-right-color: transparent; | |
border-radius: 50%; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* Center wide image */ | |
html, body, #container { | |
height: 100%; | |
} | |
#container { | |
width: 200px; | |
margin: 0 auto; | |
background: #ffd2be; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* CSS diamond without transforms */ | |
#diamond { | |
width: 0; | |
height: 0; | |
border: 50px solid transparent; | |
border-bottom: 70px solid red; | |
position: relative; | |
} | |
#diamond:after { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* CSS diamond with flat top */ | |
#diamond { | |
width: 0; | |
height: 0; | |
border: 50px solid transparent; | |
border-bottom: 20px solid red; | |
position: relative; | |
} | |
#diamond:after { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* CSS diamond without transforms */ | |
#diamond { | |
width: 0; | |
height: 0; | |
border: 50px solid transparent; | |
border-bottom-color: red; | |
position: relative; | |
} | |
#diamond:after { |