Skip to content

Instantly share code, notes, and snippets.

@briansteeleca
briansteeleca / README.md
Last active August 29, 2015 14:07
Generated by SassMeister.com: Susy Grid - 2 columns for tablet, 3 columns for laptop with gutter-position:after #susy #grid #sassmeister

##IMPORTANT: This example uses gutter-position:after

##Example: nth-of-type(an+b) nth-of-type(3n+1)

In that expression, the number b represents the ordinal position of the first element that we want to match, and the number a represents the ordinal number of every element we want to match after that. So our example expression, 3n+1 will match the first element, and every third element after that.

For IE8 see: http://stackoverflow.com/questions/8492121/ie8-nth-child-and-before

@briansteeleca
briansteeleca / script.js
Created October 1, 2014 13:40
Pinned menu with smooth scrolling (uses ScrollMagic for pin) #pin #nav #smoothscroll
$(function() {
var topOffset = $('#nav').height();
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
@briansteeleca
briansteeleca / README
Last active August 29, 2015 14:06
Susy Grid - 2 columns for tablet, 3 columns for laptop #susy #grid
##Example:
`nth-of-type(3n+1)`
In that expression, the number `b` represents the ordinal position of the first element that we want to match, and the number `a` represents the ordinal number of every element we want to match after that. So our example expression `3n+1` will match the first element, and every third element after that.
For IE8 see:
http://stackoverflow.com/questions/8492121/ie8-nth-child-and-before
@briansteeleca
briansteeleca / _mixins.scss
Last active August 29, 2015 14:06
My own mixins #mixins #sass
/* My own mixins
--------------------------------------------- */
/* make columns display at equal heights within a row */
@mixin col-equal-height {
overflow: hidden !important;
.col-equal-height {
margin-bottom: -99999px !important;
padding-bottom: 99999px !important;
}
@briansteeleca
briansteeleca / smooth-scrolling.js
Created September 10, 2014 20:41
Smooth Scrolling #stickynav #onepage #scroll
// http://css-tricks.com/snippets/jquery/smooth-scrolling
// From WordPress: Building a One-Page Style Site with Morten Rand-Hendriksen
$(function() {
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
@briansteeleca
briansteeleca / functions.php
Last active August 29, 2015 14:06
A WordPress shortcode for adding a div wrapper with attributes id and class. You can use this in the Visual Editor so that it can be seen and won't accidentally get stripped out by someone editing the entry. #wordpress #shortcode #wrap
<?php
//* Do NOT include the opening php tag
function bsca_divwrapbegin ( $atts ) {
$a = shortcode_atts(
array(
'id' => '',
'class' => '',
),
$atts );