React logo reacting
A Pen by Nathan Blenke on CodePen.
import express from 'express' | |
import * as path from 'path' | |
import cors from 'cors' | |
const app = express() | |
const PORT = process.env.PORT || 5000 | |
const __dirname = path.resolve(path.dirname('')) | |
app.use(cors()) | |
app.use(express.static(path.join(__dirname, 'public'))) |
<style> | |
.spacer { | |
height: 2800px; | |
} | |
#test { | |
position: fixed; | |
top: 0; | |
left: 0; | |
width: 100%; | |
height: 80px; |
<style> | |
.spacer { | |
height: 2800px; | |
} | |
#test { | |
position: fixed; | |
top: 0; | |
left: 0; | |
width: 100%; | |
height: 80px; |
React logo reacting
A Pen by Nathan Blenke on CodePen.
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/3.0.8/css/swiper.min.css"> | |
<style> | |
.swiper-container img { | |
max-width:100%; | |
} | |
.swiper-slide { |
<!doctype html> | |
<html> | |
<head> | |
<title></title> | |
<style> | |
.boom { | |
width:40px; | |
height:40px; | |
position:relative; |
/* jshint strict: true */ | |
/* globals $ */ | |
/* | |
* Show a "Download App" notification on Android and iPhone. | |
* Notification will appear once per page every 30 days unless dismissed, | |
* once dismissed, it won't show again for 30 days | |
*/ | |
(function () { |
var tapFlag = 0, | |
tapping = function (ev) { | |
var bool = false; | |
if (ev.type === 'touchstart') { | |
tapFlag = 1; | |
} | |
if (ev.type === 'touchmove') { | |
tapFlag = 0; | |
} | |
if (ev.type === 'touchend') { |
(function () { | |
var el = document.querySelector('#header'), | |
className = 'fixed', | |
offset = (el.offsetTop + el.offsetHeight), | |
scrollTop = function () { | |
return document.body.scrollTop || document.documentElement.scrollTop; | |
}; | |
if (scrollTop() > offset) { | |
el.className = className; |
/* | |
domModified | |
Add mutation listener to DOM element and trigger callback once it has completed | |
https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver | |
Usage: | |
domModified({ | |
selector: '#selector', |