Skip to content

Instantly share code, notes, and snippets.

@wizard04wsu
wizard04wsu / html5.htm
Last active January 4, 2017 20:42
HTML5 document template
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!-- prevent Internet Explorer from using compatibility mode -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
@wizard04wsu
wizard04wsu / bookmarklet2.css
Created April 15, 2016 18:14
CSS styling for bookmarklet links (updated)
/* add the .peel-br or .peel-tr class to a link and wrap its contents with a span */
/* example:
<a class="peel-br" href="javascript:;"><span>My bookmarklet</span></a>
*/
a.peel-br, a.peel-tr {
position:relative;
z-index:0;
}
@wizard04wsu
wizard04wsu / createFunctionWithTimeout.js
Last active March 16, 2016 19:14
Adds a timeout to a callback so that if the function isn't called within the timeout, the callback will be run anyway.
function createFunctionWithTimeout(callback, opt_timeout){
var called, timer;
//if the function *isn't* called within the timeout, execute callback() anyway
timer = setTimeout(function (){
called = true;
callback();
}, opt_timeout || 1000);
//if the function *is* called within the timeout, cancel the timer and execute callback()
@wizard04wsu
wizard04wsu / cloneEventObj.js
Last active September 10, 2017 20:21
Clones an event object. You can optionally pass new initialization values to override the ones from the cloned event object.
function cloneEventObj(eventObj, overrides){
var p, eventInit = {}, clone;
overrides = overrides || {};
for(p in eventObj){
eventInit[p] = eventObj[p];
}
for(p in overrides){
eventInit[p] = overrides[p];
}
@wizard04wsu
wizard04wsu / ellipsis.htm
Last active November 24, 2020 21:20
An absolutely-positioned ellipsis displays when a multi-line box overflows.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Ellipsis Box</title>
<style>
/* <div class="ratio-box"><div class="ratio-content">content</div></div> */
.ratio-box {
position:relative;
width:100%; /*set the width here*/
}
.ratio-box::before {
content:"";
display:block;
padding-top:75%; /*4:3 ratio*/
@wizard04wsu
wizard04wsu / goto.htm
Last active October 30, 2015 14:45
Go to a specified line & character within a text box
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Go To Line/Character</title>
</head>
@wizard04wsu
wizard04wsu / accessibleMenubar.css
Last active July 1, 2020 17:58
HTML/JavaScript menu bar that can be navigated with the mouse and keyboard. Tested with the NVDA screen reader; using ARIA role="menubar" reduces noise and automatically enters focus mode. *** requires https://gist.github.com/wizard04wsu/3ec34604d7538303e9f0 ***
ul.menubar, ul.menubar ul {
list-style-type:none;
}
ul.menubar > li {
display:inline-block;
vertical-align:top;
border:1px solid red;
}
ul.menubar ul {
display:none;
@wizard04wsu
wizard04wsu / classnames.js
Last active November 17, 2015 18:40
Class name functions
function removeClass(elem){
var classes, rxp;
if(!elem){
throw new Error("Missing parameter: elem");
}
classes = Array.prototype.slice.call(arguments, 1).join(" ").trim();
@wizard04wsu
wizard04wsu / keyboard.html
Last active September 30, 2015 14:50
Display values given for keyboard events.
<!DOCTYPE html>
<html lang="en">
<head>
<!-- to prevent IE from using compatibility mode -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="UTF-8">