Skip to content

Instantly share code, notes, and snippets.

View matherton's full-sized avatar

Mark Atherton matherton

3 followers · 10 following
View GitHub Profile
@matherton
matherton / index.html
Last active November 26, 2019 12:09
es6 Higher Order Functions & Arrays example
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<!-- The page title that is displayed in the top of the browser -->
<title></title>
<!-- Meta content describes your page and is indexed by search engines such as Google -->
<meta name="description" content="JS High Order function">
<meta name="author" content="Mark Atherton">
@matherton
matherton / .jsx
Created August 30, 2018 11:31
ES6 function for un-selectable radio buttons
radioChecked = () => {
var allRadios = document.querySelectorAll('input[type="radio"]');
allRadios.forEach(r => {
r.addEventListener('mouseup', function(e) {
if (r.checked) {
setTimeout(() => {
r.checked = false;
}, 0);
}
});
@matherton
matherton / widow resize jquery
Created September 12, 2017 15:34
$(window).resize(function() {
var captions = $('.module-main-links .caption'),
height = 0;
captions.each(function() {
var captionHeight = $(this).outerHeight();
if (captionHeight > height) {
height = captionHeight;
}
});
@matherton
matherton / window-resize.js
Last active September 3, 2015 15:38
JS resize function for mobile and tablet
$(window).resize(function() {
//var viewportWidth = $(window).width(); jQuery selector has inconsistencies with Media Queries
var viewportWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; // JS better consistency with Media Queries
/*Mobile view*/
if (( viewportWidth <= 600 ) || ( viewportWidth > 776 ) && (viewportWidth < 921)) {
//Setup Markup to add attribute requirements for mobile
console.log( "on mobile" );
}
/*Descktop view */
else {
@matherton
matherton / index.htm
Created August 5, 2015 11:46
Progress bars for 4 stages
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Progress bar demo</title>
<meta name="description" content="vanilla progress bar">
<meta name="author" content="Mark Atherton">
@matherton
matherton / linkremove.js
Last active August 29, 2015 14:17
JS snippet remove link according if on URL
if (document.URL.indexOf("PAGE-NAME") >= 0) {
$('a[href="/page-name"]').hide();
}
/*
= is exactly equal
!= is not equal
^= is starts with
$= is ends with
*= is contains
@matherton
matherton / blamk-responsive-email-template
Created January 30, 2015 17:09
A blank 1 column full width responsive email template
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Email</title>
<style>
/*desktop css*/
@matherton
matherton / functions
Created January 9, 2015 17:09
Bootstrap making first instance of select class form-control unselectable in IE8 fix
$(function () {
if (navigator.userAgent.indexOf('MSIE 8.0') > 0 ) {
var $formControl = $('select.form-control:first');
if ($formControl.length > 0) {
$formControl.before('<select class="form-control" style="display:none"></select>');
}
}
}());
@matherton
matherton / Dynamic Button
Last active August 29, 2015 14:04
Dynamic button that changes it's text and adds/removes amount onClick
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<!-- The page title that is displayed in the top of the browser -->
<title>Dynamic button demo</title>
<!-- Meta content describes your page and is indexed by search engines such as Google -->
<meta name="description" content="The HTML5 BASE template">
@matherton
matherton / Drop Down ie.css
Last active August 29, 2015 13:59
Simple drop dow Nav
ul.dropdown ul li { display: inline; width: 100%; }