Skip to content

Instantly share code, notes, and snippets.

View hsnyc's full-sized avatar
🎯
Focusing

Henry hsnyc

🎯
Focusing
View GitHub Profile
@hsnyc
hsnyc / update-year.html
Last active May 2, 2023 18:05
Update the Year in the page footer
<footer>
<div class="wrapper">&copy;<span id="current-year">2019</span> HSNYC</div>
</footer>
@hsnyc
hsnyc / IntersectionObserver.js
Created February 25, 2021 18:33
Intersection Observer to check if Elem is intersecting
/* ===
Intersection Observer API
Note: Use to do something when elem comes into viewport, among other things.
https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API
===*/
let options = {
rootMargin: '0px',
threshold: 1.0
}
@hsnyc
hsnyc / accordion.html
Created October 21, 2020 20:05
simple accordion
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Accordion</title>
<!--
code source: https://www.w3schools.com/howto/howto_js_accordion.asp
with minor modifications
@hsnyc
hsnyc / isInViewport.js
Created October 11, 2020 16:17
Check If an Element is Visible in the Viewport
/*
If the element is in the viewport, the function returns true. Otherwise, it returns false.
https://www.javascripttutorial.net/dom/css/check-if-an-element-is-visible-in-the-viewport/
*/
function isInViewport(el) {
const rect = el.getBoundingClientRect();
return (
rect.top >= 0 &&
rect.left >= 0 &&
@hsnyc
hsnyc / index.html
Created June 18, 2020 13:40
Add current year to a div in footer
<footer>
<div class="wrapper">&copy;<span id="current-year">2019</span> HSNYC</div>
</footer>
@hsnyc
hsnyc / sticky.css
Last active February 4, 2020 16:42
A small script to make an element stick as you scroll vertically
.sticky {
position: fixed;
top: 40px;
background-color: #f7f8f9;
padding: 20px;
}
/* You can add a transition to the #div-to-make-sticky element to make the change smooth, for example */
#div-to-make-sticky {
transition: padding 300ms ease-in;
@hsnyc
hsnyc / scroll-with-offset.js
Last active May 5, 2022 16:11
Smooth scroll to #hash links with and without offset
// Smooth Scroll to #links | with Off-Set ==================================== //
//get all # links in the document
let links = document.querySelectorAll('a[href*="#"]');
// console.log(links);
//assign a click event to all the # links
for(let l = 0; l < links.length; l++) {
links[l].addEventListener('click', scrollMe, false);
}
@hsnyc
hsnyc / functions.php
Last active March 30, 2019 17:26
Custom Wordpress Login Page
/* place this code in your functions.php file */
/*=== LOGIN Page Functions Start ===*/
//Loads the login page css styles
function custom_login() {
echo '<link rel="stylesheet" type="text/css" href="' . get_bloginfo('stylesheet_directory') . '/login/login-styles.css" />';
}
add_action('login_head', 'custom_login');
@hsnyc
hsnyc / scroll-to-top-bttn.css
Last active March 30, 2019 16:59
When the user scrolls down 1020px from the top of the document, show a button that will scroll back to the top of the page
/* Back to Top Icon */
#btt-icon {
width: 46px;
height: 50px;
position: fixed;
bottom: 40px;
right: 40px;
background-color: rgba(136, 136, 136, 0.18);
cursor: pointer;
border-radius: .2rem;
@hsnyc
hsnyc / keybase.md
Created April 4, 2017 13:45
Keybase Identity Check

Keybase proof

I hereby claim:

  • I am hsnyc on github.
  • I am hsnyc (https://keybase.io/hsnyc) on keybase.
  • I have a public key whose fingerprint is 2B66 14BF E964 DE6E 0381 FE03 AA1A 0ABC 8B4A 5097

To claim this, I am signing this object: