Skip to content

Instantly share code, notes, and snippets.

View ethanmay's full-sized avatar

Ethan May ethanmay

6 followers · 8 following
View GitHub Profile
@ethanmay
ethanmay / index.html
Created April 19, 2023 18:33
Luminance testing on scroll for a given x/y coordinate
<html>
<head>
<style>
body {
margin: 0;
padding: 0;
}
.nav {
position: fixed;
background: #FFF;
@ethanmay
ethanmay / collapsibleMenu.js
Created March 9, 2022 16:26
Expand/collapse menu on scroll
var currentMenuState = 'open'
var lastScrollPosition = window.scrollY
const minimizeMenuY = 60
const collapseMenu = () => {
$('.top-bar-container').css('overflow', 'hidden')
gsap.to('.top-bar-container', {
height: 0,
duration: 0.5,
ease: 'power3.inOut'
@ethanmay
ethanmay / circleHoverAnim.js
Created November 11, 2021 22:19
Simply include GSAP & the GSAP CSS Plugin, change myBtnSelector to a CSS selector of your choice, and enjoy.
const myBtnSelector = '.wp-block-button__link'
const initFancyButtons = () => {
$(myBtnSelector).prepend('<span class="circle"></span>')
$(myBtnSelector).each( function() {
const $circle = $(this).find('.circle')
$(this).on('mouseenter tap', function( evt ) {
const $target = $(this)
const x = evt.clientX - $target.offset().left
const y = evt.clientY - $target.offset().top
@ethanmay
ethanmay / equalizeElementHeights.js
Last active October 22, 2021 20:28
Vanilla JS way to equalize heights of elements
//https://davidwalsh.name/javascript-debounce-function
function debounce(func, wait, immediate) {
var timeout;
return function() {
var context = this, args = arguments;
var later = function() {
timeout = null;
if (!immediate) func.apply(context, args);
};
var callNow = immediate && !timeout;
@ethanmay
ethanmay / location.js
Last active June 30, 2016 15:31
Location Details example, update reference, and instructions
// The below JSON object is an example of all the necessary information
// for adding a location to the tour map. This specific example can be
// found in the live code at lines 845 - 880. I have annotated this object
// to explain what each property does.
// If you need to add an entirely new location to the map, follow these instructions:
// 1. Highlight & copy the below JSON object
// 2. In the code (index.html), find the last JSON location, currently located at line 1240
// 3. Place your cursor after the "}," and hit Enter, then paste in the new JSON object
// 4. Edit the JSON object as needed