Experimenting with Gist, Gistup, Bl.ocks.org, D3, JSON-Generator, and some vanilla javascript.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$('body').on "click", -> | |
//If element to hide is open | |
$('.elementToHide').hide() | |
$('.elementToHide').on "click", (e) -> | |
e.stopPropagation() |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
activeMenuStyles = -> | |
loc = "/" + window.location.pathname.split("/")[1] | |
style = (link) -> | |
href = $(link).attr('href') | |
if href == loc | |
$(link).addClass('active') | |
menuLinks = $('#main > a') | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$('nav').find('a').on 'click', -> | |
that = $(this) | |
target = $(this.hash) | |
if !target.length | |
target = $('[name=' + this.hash.slice(1) +']') | |
$('html,body').animate({ | |
scrollTop: target.offset().top | |
}, 1000, -> | |
#update the url hash |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<html class="no-js" lang=""> | |
<head> | |
<meta charset="utf-8"> | |
<meta http-equiv="x-ua-compatible" content="ie=edge"> | |
<title></title> | |
<meta name="description" content=""> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
<link rel="stylesheet" href="style.css"> | |
</head> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Select all HTML elements with class .text-input | |
var $inputs = $('.text-input'); | |
// Create event handling functions | |
function textInputFocusHandler(){ console.log('focus');} | |
function textInputBlurHandler(){ console.log('blur'); } | |
// Attach focus & blur handlers to selected inputs | |
$inputs.on('focus', textInputFocusHandler); | |
$inputs.on('blur', textInputBlurHandler); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Select all HTML elements with class .text-input | |
var inputs = document.getElementsByClassName('text-input'); | |
// Create event handling functions | |
function textInputFocusHandler(){ console.log('focus');} | |
function textInputBlurHandler(){ console.log('blur'); } | |
// Attach focus & blur handlers to selected inputs | |
inputs.addEventListener('focus', textInputFocusHandler); | |
inputs.addEventListener('blur', textInputBlurHandler); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Attach focus & blur handlers to the first selected input | |
inputs[0].addEventListener('focus', textInputFocusHandler); | |
inputs[0].addEventListener('blur', textInputBlurHandler); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Loop through the elements in the array-like object | |
// and attach an event listener to each element | |
inputs.forEach(function(el, index, array){ | |
el.addEventListener('focus', textInputFocusHandler); | |
el.addEventListener('blur', textInputBlurHandler); | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Use the Array.prototype.forEach method and the | |
// .call method to loop through the array-like object | |
Array.prototype.forEach.call(inputs, function(el, index, array){ | |
el.addEventListener('focus', textInputFocusHandler); | |
el.addEventListener('blur', textInputBlurHandler); | |
}); |
OlderNewer