Skip to content

Instantly share code, notes, and snippets.

View haydenbleasel's full-sized avatar
🔮
Working on Eververse

Hayden Bleasel haydenbleasel

🔮
Working on Eververse
397 followers · 67 following
View GitHub Profile
@haydenbleasel
haydenbleasel / transfade.js
Last active July 14, 2019 10:23
Medium-style vertical fading parallax scroll modifier for Stellar.js
// Custom transform and opacity modifier for Stellar.js
$.stellar.positionProperty.transfade = {
setPosition: function(element, newLeft, originalLeft, newTop, originalTop) {
var distance = newTop - originalTop;
var rate = $(window).height() / 5;
element.css('transform', 'translate3d(0, ' + distance + 'px, 0').css('opacity', 1 - (distance / rate));
}
};
@haydenbleasel
haydenbleasel / sanitize.js
Created March 18, 2014 06:50
Javascript filename sanitization
// Sanitize a filename. Try 'df.34.%)sdfE$t5.HF.mp4'
var extension = fileName.split('.').slice(0).pop(),
sanitized = filename.replace(extension, '').replace(/\W+/g, '') + "." + extension;
@haydenbleasel
haydenbleasel / gist-flat-dark.less
Last active December 26, 2022 19:14
A collection of GitHub Gist styles and themes.
.gist {
.gist-file {
border: none !important;
margin-bottom: 0 !important;
.gist-data {
border-bottom: 2px solid #7f8c8d !important;
.line-numbers {
border-right: 2px solid #7f8c8d !important;
padding: 1em !important;
}
@haydenbleasel
haydenbleasel / jquery-soundcloud.js
Last active November 18, 2015 05:24
jQuery setup for the SoundCloud API
$ ->
# Create abc,def string
Number::numberWithCommas =
String::numberWithCommas = ->
@toString().replace /\B(?=(\d{3})+(?!\d))/g, ','
# Initial sound is empty
sound = undefined
@haydenbleasel
haydenbleasel / .editorconfig
Last active March 5, 2016 15:28
My default configuration files.
root = true
[*]
indent_style = space
indent_size = 4
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
@haydenbleasel
haydenbleasel / gulpfile.js
Created April 18, 2016 06:08
Catalyst: task automation boilerplate for experienced web developers
const gulp = require('gulp'),
sync = require('browser-sync').create(),
del = require('del'),
minimist = require('minimist')(process.argv.slice(2)),
$ = require('gulp-load-plugins')(),
info = require('./package.json'),
header = '/*! Built with Catalyst. */',
staticFiles = gulp.src([
'test/source/**/*',
'!test/source/**/*.html',
@haydenbleasel
haydenbleasel / dribbble.html
Last active April 27, 2016 13:45
Dribbble feed for portfolio
#dribbble
.row.clearfix.hidden-xs
noscript Sorry, you need Javascript enabled to view these Dribbble shots.
.column-3
p Simplicity, functionality and accessibility will always remain at the core of my philosphy. I like to combine aspects of print and graphic such as dynamic layouts and typographic flourishes with the principles of modern, minimalism.
@haydenbleasel
haydenbleasel / github.js
Created April 24, 2016 05:50
GitHub chart for website.
#github
.row.clearfix
#canvas-container.hidden-xs
canvas#repositories
noscript Sorry, you need Javascript enabled to view this chart.
@haydenbleasel
haydenbleasel / strikethrough.js
Created April 26, 2016 12:54
Animated strikethrough on hover
$('a').addClass('strikethrough').hover(
(e) => $(e.target).stop().addClass('mouseenter'),
(e) => {
$(e.target).stop().removeClass('mouseenter').addClass('mouseleave');
setTimeout(() => {
$(e.target).stop().removeClass('mouseleave').addClass('no-transition');
}, STIKETHROUGH_DURATION - STIKETHROUGH_OFFSET);
setTimeout(() => {
$(e.target).stop().removeClass('no-transition');
}, STIKETHROUGH_DURATION + STIKETHROUGH_OFFSET);
@haydenbleasel
haydenbleasel / boilerplate.html
Last active April 10, 2019 17:17
A powerful HTML5 boilerplate for the modern web.
<!-- HTML5 Doctype. Remember to delete these comments (Quirks Mode). -->
<!doctype html>
<!-- HTML tag -->
<html lang="">
<!-- Let's get started -->
<head>
<!-- Document settings and metadata -->