Skip to content

Instantly share code, notes, and snippets.

/index.html

Created March 16, 2017 07:29
Show Gist options
  • Save anonymous/c8f76390c90f31c481cc1737be7b37fe to your computer and use it in GitHub Desktop.
Save anonymous/c8f76390c90f31c481cc1737be7b37fe to your computer and use it in GitHub Desktop.
Download ZIP
JS Bin // source http://jsbin.com/paqeferusa
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<style id="jsbin-css">
div{
border:1px solid red;
width: 30px;
text-align:center;
}
</style>
</head>
<body>
<img src="http://p1.bqimg.com/4851/58256aa9712d5c5c.jpg" alt="">
<div>0</div>
<div>8</div>
<div>3</div>
<div>1</div>
<div>1</div>
<div>2</div>
<div>0</div>
<div>8</div>
<script id="jsbin-javascript">
var MATCHES_SELECTOR = [
'webkitMatchesSelector',
'mozMatchesSelector',
'matchesSelector'
].filter(function(name){
return this[name];
}, doc.body)[0];
var TPL_CARD = '<div class="front">{{contents}}</div>';
var clickEvents = {
'.card, .card *': function(){
var sender = this;
}
};
delegate(doc.body, 'click', clickEvents);
function delegate(elm, subject, table){
var selectors = Object.keys(table);
elm.addEventListener(subject, function(e){
var target = e.target;
selectors.forEach(function(selector){
if (target[MATCHES_SELECTOR](selector)) {
this[selector].call(target, e);
}
}, table);
});
}
</script>
<script id="jsbin-source-css" type="text/css">div{
border:1px solid red;
width: 30px;
text-align:center;
}</script>
<script id="jsbin-source-javascript" type="text/javascript"> var MATCHES_SELECTOR = [
'webkitMatchesSelector',
'mozMatchesSelector',
'matchesSelector'
].filter(function(name){
return this[name];
}, doc.body)[0];
var TPL_CARD = '<div class="front">{{contents}}</div>';
var clickEvents = {
'.card, .card *': function(){
var sender = this;
}
};
delegate(doc.body, 'click', clickEvents);
function delegate(elm, subject, table){
var selectors = Object.keys(table);
elm.addEventListener(subject, function(e){
var target = e.target;
selectors.forEach(function(selector){
if (target[MATCHES_SELECTOR](selector)) {
this[selector].call(target, e);
}
}, table);
});
}
</script></body>
</html>
Raw
jsbin.paqeferusa.css
div{
border:1px solid red;
width: 30px;
text-align:center;
}
Raw
jsbin.paqeferusa.js
var MATCHES_SELECTOR = [
'webkitMatchesSelector',
'mozMatchesSelector',
'matchesSelector'
].filter(function(name){
return this[name];
}, doc.body)[0];
var TPL_CARD = '<div class="front">{{contents}}</div>';
var clickEvents = {
'.card, .card *': function(){
var sender = this;
}
};
delegate(doc.body, 'click', clickEvents);
function delegate(elm, subject, table){
var selectors = Object.keys(table);
elm.addEventListener(subject, function(e){
var target = e.target;
selectors.forEach(function(selector){
if (target[MATCHES_SELECTOR](selector)) {
this[selector].call(target, e);
}
}, table);
});
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment