Christine sidepodcast

sidepodcast / sprites.html

Created October 2, 2014 01:31

Safari 7.1 issue displaying SVG fragments

	<html>
	<head>
	<style>
	p { background: #f5f4ee; }
	p:hover { background: #9d8380; }
	</style>
	</head>
	<body>
	<p><img src="https://a.sidepodcast.com/svg/sidepodcast-f1-encyclopedia-icons.svg#car" width="100" height="100" alt="Car icon"></p>
	<p><img src="https://a.sidepodcast.com/svg/sidepodcast-f1-encyclopedia-icons.svg#chequered-flag" width="100" height="100" alt="Chequered flag icon"></p>

sidepodcast / 3d-rotate.html

Created August 23, 2012 12:41

3D rotate (webkit sample)

	<!doctype html>
	<head>
	<meta charset=utf-8>
	<title>3D spin</title>
	<style>
	/*
	* nb: -webkit only for brevity. tested in chrome 21
	*/
	body {
	-webkit-perspective: 800px;

sidepodcast / dabblet.css

Created February 1, 2012 02:10

iOS5 audio example for normalize.css (using dabblet)

	audio { display: inline-block; display: inline; zoom: 1; }
	audio:not([controls]) { display: none; }

	div {
	background: #fe57a1;
	color: #fafafa;
	}

	.chunky-div > audio:not([controls]) { background: #444; }
	.svelte-div > audio:not([controls]) { background: #444; height: 0; }

sidepodcast / basic-styles.css

Created August 20, 2010 18:32

Basic CSS style rules

	/* vertical scrollbar placeholder */
	html { overflow-y: scroll; }

	/* inverse selection highlight */
	::selection { background: #3f87cb; color: #fff; text-shadow: none; }

sidepodcast / select-list-items.js

Created August 20, 2010 18:30

Find custom data attribute information using jQuery

	// nb: assumes use of jquery
	//
	// array
	var existing = [];

	// grab list items
	$("li[data-identifier]").each(function() {
	// add to array
	existing.push($(this).attr("data-identifier"));
	});