Skip to content

Instantly share code, notes, and snippets.

View alexmahan's full-sized avatar

Alex Mahan alexmahan

29 followers · 4 following
View GitHub Profile
@alexmahan
alexmahan / shynav
Last active March 16, 2023 19:52
Simple vanilla JS script for a throttled shy header/nav on scroll
<script>
// sticky/shy header
const header = document.querySelector('.js-header');
const headerHeight = header.offsetHeight;
const headerClass = '-hidden';
let scrollPosition = 0;
let timeout = false;
window.addEventListener('scroll', function() {
if (!timeout) {
@alexmahan
alexmahan / scrollToElem
Last active August 25, 2016 22:17
Simple scrollTo method using Typescript and Greensock
scrollToElem(e): void {
e.preventDefault();
const target = {
y: window.scrollY,
};
const elemTopPos = this.anyElem.offsetTop;
TweenMax.to(target, 0.5, {
y: elemTopPos,
onUpdate: () => {
window.scrollTo(0, target.y);
@alexmahan
alexmahan / landscape-mediaquery.scss
Last active May 3, 2018 13:28
Landscape orientation media query mixin for Android. When the keyboard pops up in portrait mode, the window resize event is triggered and it thinks that the device is in landscape mode. This behavior is stupid (http://blog.abouthalf.com/development/orientation-media-query-challenges-in-android-browsers). This fixes that, mostly.
@mixin mobile-landscape() {
@media only screen and (max-height: 420px) and (max-width: 767px) and (orientation: landscape) and (min-aspect-ratio: 13/9) {
@content;
}
}
@alexmahan
alexmahan / TagPulse.php
Created August 19, 2014 00:19
Insane hack to add external navigation to Pulse slideshows in Koken
<?php
class TagPulse extends Tag {
function _clean_val($val)
{
if (strpos($val, '$') === 0)
{
return $val;
}
@alexmahan
alexmahan / vidLooper.js
Last active January 4, 2016 18:49
Loops through a bunch of videos (however many you want) and plays them infinitely. You can set the first one to "autoplay" in the markup if you wish. This uses jQuery but could be (should be) vanilla JavaScript easily enough. Doesn't work in IE8 or under (duh) because it uses addEventListener and uses the <video> element with no flash fallback.
vidLooper = function() {
var allVids = $('.vid');
$.each(allVids, function(index, value) {
if (index < allVids.length-1) {
value.addEventListener('ended', function() {
var nextVid = allVids.eq(index+1);
nextVid[0].play();
});
} else if (index === allVids.length-1) {
value.addEventListener('ended', function() {
@alexmahan
alexmahan / getDate
Last active December 28, 2015 19:29
Oh so you wanna conditionally output some day/month/time-related shit in JS without using a library? This is some wack shit you could use. Could be good if you are making a website for a shop that has no back-end logic for open/close times.
getDate: {
init: function() {
var dateContainer = document.getElementById('date'),
today = new Date(),
dayNames= ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
monthNames = ['January', 'February', 'March', 'April', 'May', 'June','July', 'August', 'September', 'October', 'November', 'December'],
dayText = dayNames[today.getDay()],
monthText = monthNames[today.getMonth()],
dateText = today.getDate(),
weekday = today.getDay();