Skip to content

Instantly share code, notes, and snippets.

View jzeltman's full-sized avatar

Joshua Zeltman jzeltman

20 followers · 1 following
View GitHub Profile
@jzeltman
jzeltman / gist:bbff1c38d63b59b7f0d5b3b35b37c1f2
Created December 21, 2022 15:11
[
{
"title": "Stylish Family Apartment",
"tags": ["Interior"],
"image": "http://templates.thememodern.com/theratio/images/projects-grid/project1.jpg",
"url": "http://templates.thememodern.com/theratio/project.html"
},
{
"title": "Minimalist Guest House",
"tags": ["Decor","Interior"],
@jzeltman
jzeltman / eslint-plugin-jsx-a11y-all-rules.json
Created September 20, 2019 13:24 — forked from chalisegrogan/eslint-plugin-jsx-a11y-all-rules.json
ESLint All eslint-plugin-jsx-a11y rules
{
"rules": {
"jsx-a11y/anchor-has-content": 1,
"jsx-a11y/aria-props": 1,
"jsx-a11y/aria-proptypes": 1,
"jsx-a11y/aria-role": 1,
"jsx-a11y/aria-unsupported-elements": 1,
"jsx-a11y/click-events-have-key-events": 1,
"jsx-a11y/heading-has-content": 1,
"jsx-a11y/href-no-hash": 1,
@jzeltman
jzeltman / featureDetectionPolyfills.js
Created June 13, 2019 13:29
Load Polyfills based on Feature Detection
function browserSupportsAllFeatures() {
// Your Polyfill needs go here
return window.Promise && window.fetch && window.Symbol;
}
function loadScript(src, done) {
let js = document.createElement('script');
js.src = src;
js.onload = function() {
done();
@jzeltman
jzeltman / loadScript.js
Created June 13, 2019 13:26
loadScript.js - JavaScript Script Loader Utility Method
function loadScript(src, done) {
let js = document.createElement('script');
js.src = src;
js.onload = function() {
done();
};
js.onerror = function() {
done(new Error('Failed to load script ' + src));
};
document.head.appendChild(js);
@jzeltman
jzeltman / HTL Responsive Images w Lazy Loading
Last active December 6, 2018 20:13
HTL Responsive Images w Lazy Loading for Adobe AEM. Utilizing the lazysizes lazyloading library.
// LazyLoad Library: https://github.com/aFarkas/lazysizes
// Usage
<sly data-sly-use.template="/path/to/template/image.html"
data-sly-call="${ template.imageMarkup @ xsvp=image.xsvpPath, svp=image.svpPath, mvp=image.mvpPath, lvp=image.lvpPath, altText=image.altText, lazyLoad=true }" />
// HTL Template
<template data-sly-template.imageMarkup="${ @ xsvp, svp, mvp, lvp, altText, lazyLoad }">
<picture>
<source media="(max-width: 480px)" data-srcset="${xsvp}" />
@jzeltman
jzeltman / gist:7695df31ff24866ce75e
Created April 20, 2015 16:52
jQuery like querySelector(All)
// Returns first element that matches CSS selector {expr}.
// Querying can optionally be restricted to {container}’s descendants
function $(expr, container) {
return typeof expr === "string"? (container || document).querySelector(expr) : expr || null;
}
// Returns all elements that match CSS selector {expr} as an array.
// Querying can optionally be restricted to {container}’s descendants
function $$(expr, container) {
return [].slice.call((container || document).querySelectorAll(expr));
@jzeltman
jzeltman / hash-navigation
Created July 10, 2012 14:54
#hash based navigation pattern
<!DOCTYPE html>
<!--[if lt IE 7 ]> <body class="ie6"> <![endif]-->
<!--[if IE 7 ]> <body class="ie7"> <![endif]-->
<!--[if IE 8 ]> <body class="ie8"> <![endif]-->
<!--[if IE 9 ]> <body class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en" dir="ltr" class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
@jzeltman
jzeltman / gist:2417911
Created April 19, 2012 02:14
i don't know what i'm doing with the return method
var testObj = {};
testObj.name = "Larry";
testObj.getName = function() { return testObj.name; }
// Outputs: function () { return testObj.name; }