Kasia kaaes

Spotify ♥ ︎Hack Out West 2015
Tools and Resources Cheatsheet

	<!DOCTYPE html>
	<html>
	<link href="style.css" rel="stylesheet" />
	<body>
	<button id="open">click!</button>
	<div id="popup" class="closed"><button id="close">click!</button></div>
	</body>
	<script src="popup.js"></script>
	<script>
	var p = document.getElementById('popup');

	function delegate(element, eventType, selector, callback, bubble) {
	var selectorObj = getSelectorType(selector);
	var callbackFn;

	selector = selectorObj.value;

	switch (selectorObj.type) {
	case 'tag':
	callbackFn = tagSelector;
	break;

	<!DOCTYPE html>

	<html>
	<head>
	<meta charset="utf-8" />

	<title>Binding the same event listeners more than once</title>

	</head>

	/**
	* Object descriptor
	**/

	var a = {
	prop1 : 14
	}

	var descriptorObj1 = Object.getOwnPropertyDescriptor(a, 'prop1');

	#container {
	background: #fff url(gradient.gif) repeat-x bottom;
	background: -webkit-gradient(
	linear, 0 100%, 0 0,
	from(#ecebe7), color-stop(50%, #fff), to(#fff)
	);
	background: -webkit-linear-gradient(bottom, #ecebe7, #fff 50%, #fff);
	background: -moz-linear-gradient(bottom, #ecebe7, #fff 50%, #fff);
	}

	interface EventTarget {
	void addEventListener(in DOMString type,
	in EventListener listener,
	in boolean useCapture);
	};

	var link = document.getElementById('#myLink');

	// use bubbling:
	link.addEventListener('click', callbackFnForClick, false);

	el.onclick = function(evt) {
	addStyle.call(this, '#f00', 'solid 2px blue');
	}

	// both will have identical effect

	el.onclick = function(evt) {
	addStyle.apply(this, ['#f00', 'solid 2px blue']);
	}

	el.onclick = function(evt) {
	this.style.backgroundColor = '#f00';
	this.style.borderBottom = 'solid 2px blue';
	}

	el2.onclick = function(evt) {
	this.style.backgroundColor = '#ff0';
	this.style.borderBottom = 'dotted 1px green';
	}

	<!DOCTYPE html>
	<html>
	<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8">
	<script src="http://yui.yahooapis.com/3.3.0/build/yui/yui-min.js" charset="utf-8" type="text/javascript">
	</script>
	<title>Event Loop</title>
	<style type="text/css">
	div {height: 5px; margin-bottom: 3px;}
	</style>