Skip to content

Instantly share code, notes, and snippets.

View cscuderi's full-sized avatar
🇮🇹

Carlin cscuderi

🇮🇹
18 followers · 13 following
View GitHub Profile
@cscuderi
cscuderi / 60fps.css
Last active December 30, 2015 01:09
JavaScript that toggles a universal class on scroll to disable pointer events. Removes the class when the user stops scrolling. From http://www.thecssninja.com/javascript/pointer-events-60fps
.disable-hover,
.disable-hover * {
pointer-events: none !important;
}
@cscuderi
cscuderi / sliding-menu.html
Last active January 1, 2016 07:59
A nice CSS3 sliding menu with fallback for older browsers.
<div id="outer-wrap">
<div id="inner-wrap">
<a id="nav-open-btn" class="menu-toggle" href="#nav">Toggle navigation</a>
<nav id="nav" class="main" role="navigation">
<div class="block">
<h2>Menu</h2>
<ul>
<li><a href="#">Information</a></li>
@cscuderi
cscuderi / ie7-pseudo.css
Created January 3, 2014 18:13
Adds support for :before and :after (in the form of .before and .after classes) to IE7. Use with Modernizr.
.lt-ie8 .class-selector {
*zoom: expression(
this.runtimeStyle.zoom="1",
this.insertBefore(
document.createElement("div"),
this.childNodes[0]
).className="before",
this.appendChild(
document.createElement("div")
).className="after"
@cscuderi
cscuderi / animate-svg-path.js
Created September 1, 2014 00:52
Animate SVG path
var path = document.querySelector('.squiggle-animated path');
var length = path.getTotalLength();
// Clear any previous transition
path.style.transition = path.style.WebkitTransition =
'none';
// Set up the starting positions
path.style.strokeDasharray = length + ' ' + length;
path.style.strokeDashoffset = length;
// Trigger a layout so styles are calculated & the browser
// picks up the starting position before animating
@cscuderi
cscuderi / inline-svg-with-fallback.html
Created September 1, 2014 00:54
Inline SVG with fallback
<svg width="96" height="96">
<image xlink:href="svg.svg" src="svg.png" width="96" height="96"/>
</svg>
@cscuderi
cscuderi / break-text.css
Last active August 29, 2015 14:16
Breaks text cross-browser
.break-text {
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}
@cscuderi
cscuderi / img-alt-list.js
Last active May 4, 2018 14:17
// Really quick way to dump <img> tags and alt text into the console
// Useful for checking a11y
let imgs = document.getElementsByTagName('img');
for(var i = 0; i < imgs.length; i++) {
console.log('--------------------------------\n', imgs[i], '\nAlt text: '+imgs[i].getAttribute('alt')+'\n');
}
@cscuderi
cscuderi / Default (OSX).sublime-keymap
Last active September 30, 2016 14:54
Sublime Text 3 user settings
[
{ "keys" : ["super+\\"], "command" : "toggle_side_bar" },
{ "keys" : ["ctrl+alt+left"], "command": "move_to", "args": {"to": "bol", "extend": false} },
{ "keys" : ["ctrl+alt+right"], "command": "move_to", "args": {"to": "eol", "extend": false} },
{ "keys": ["super+up"], "command": "noop" },
{ "keys": ["super+down"], "command": "noop" }
]
@cscuderi
cscuderi / download.js
Created August 6, 2016 00:02
Download a file using JavaScript
// Download a PDF
var fileName = 'My file';
var fileURL = 'http://localhost/my-file.pdf';
// Non-IE
if (!window.ActiveXObject) {
var save = document.createElement('a');
save.href = fileURL;
save.target = '_blank';
save.download = fileName || 'unknown';
@cscuderi
cscuderi / Slack Themes.css
Last active September 6, 2018 13:04
Themes for Slack
/* Purple */
#4b6bc6,#2f3e4e,#F0f0f0,#0081f8,#2F3E4E,#ffffff,#39da51,#ff6058
/* DevLdn (Green) */
#a0b530,#F8F8FA,#64711b,#FFFFFF,#FFFFFF,#000000,#334d2f,#FF8669
/* DevLdn alt */
#334d2f,#2c4a2d,#388038,#FFFFFF,#4a634b,#FFFFFF,#94E864,#78AF8F
/* A11y (yellow) */