Skip to content

Instantly share code, notes, and snippets.

View neutraltone's full-sized avatar
🏠
Working from home

Tony Phipps neutraltone

🏠
Working from home
166 followers · 32 following
View GitHub Profile
@neutraltone
neutraltone / array-randomizer.js
Last active January 13, 2016 23:57
Randomly print out the items of an array without repeating the last thing printed in JavaScript. https://coderwall.com/p/m_jldw
lastIndex = 0; // Just the first time. Could be a random number too.
setInterval(function(){
lastIndex = dnr(lastIndex, 10); // 10 being the max.
console.log(lastIndex);
}, 1000); // Every 1 sec.
// Do not repeat. Never gives the same number twice.
function dnr(lastIndex, length){
var randIndex = Math.floor((Math.random()*length));
@neutraltone
neutraltone / active-navigation-item.js
Last active January 14, 2016 00:08
JavaScript to highlight current navigation item.
/**
* Active Nav Item
*/
// Get the URL
var url = window.location;
// Select nav list item and select
// Will only work if string in href matches with location
$('ul.nav a[href="'+ url +'"]').parent().addClass('selected');
@neutraltone
neutraltone / Photoset Layout Generator
Last active July 25, 2016 12:46
Random layout generator for Photoset jQuery plugin (http://stylehatch.github.com/photoset-grid/) based on the number of given images.
<?php
$image_counts = array(1,5,8,4,3,6,2,6,6,5,10);
$possible = array(1,2,4);
$total_counts = array();
foreach ($image_counts as $imgcount) {
$done = false;
$totals = array();
$total = 0;
@neutraltone
neutraltone / equal-height-columns.js
Last active January 14, 2016 00:07
This piece of jQuery will calculate the height of columns and resize the shorter ones to be the same height as the tallest one.
function equalCols() {
$('.js-cols').each(function() {
var tallestCol = 0;
currentHeight;
$(this).find('.js-col').each(function() {
$(this).css('height', 'auto');
currentHeight = $(this).height('auto').height();
if (currentHeight > tallestCol) {
tallestCol = currentHeight;
}
@neutraltone
neutraltone / visibility-transitions.css
Last active August 25, 2016 23:04
This is a small example of fading things in and out using visibility Hidden and opacity. As described here:http://www.greywyvern.com/?post=337#
ul > li {
visibility:hidden;
opacity:0;
transition:visibility 0s linear 0.5s,opacity 0.5s linear;
}
ul:hover > li {
visibility:visible;
opacity:1;
transition-delay:0s;
@neutraltone
neutraltone / Dialog Example.markdown
Last active January 14, 2016 00:12
Dialog Example
@neutraltone
neutraltone / _icons.scss
Created January 30, 2016 19:08
An example of using BEM and OCSS for icons
%icon {
content: '';
display: block;
&--open {
@extend %icon;
background-image: url('../img/plus.svg');
}
&--close {
@neutraltone
neutraltone / base_defaults
Created February 12, 2016 23:57
//------------------------------------*\
// $BASE-DEFAULTS
//------------------------------------*/
:root {
font: 400 #{($base-font-size/16px)*1em}/#{$base-line-height/$base-font-size} $base-font-family;
}
@neutraltone
neutraltone / gulpfile.js
Last active January 25, 2018 03:22
A gulp task for creating SVG sprites, loading them into your template with AJAX and styling them with CSS
/**
* Gulp Packages
* =============
* Import our gulp packages.
*/
import gulp from 'gulp';
import svgmin from 'gulp-svgmin';
import svgstore from 'gulp-svgstore';
import cheerio from 'gulp-cheerio';
@neutraltone
neutraltone / SassMeister-input-HTML.html
Created February 16, 2016 09:16
Generated by SassMeister.com.
<div class="header header--sticky">
<div class="header__container header__container--active">
<nav>navigation</nav>
</div>
</div>