Skip to content

Instantly share code, notes, and snippets.

Avatar

Mark Lee leemark

View GitHub Profile
@leemark
leemark / full-viewport-animated-background.html
Last active Jan 16, 2020
Full-screen animated gif background
View full-viewport-animated-background.html
<!doctype html>
<html>
<head>
<meta charset=utf-8>
<title>horse</title>
<link href='http://fonts.googleapis.com/css?family=Spirax' rel='stylesheet' type='text/css'>
</head>
<body>
<h1>Sallie Gardner at a Gallop</h1>
</body>
View a-frame-clock
a-frame clock
-------------
A simple example of how to build a reusable component in A-frame.
A [Pen](http://codepen.io/leemark/pen/KmKoPy) by [Mark Lee](http://codepen.io/leemark) on [CodePen](http://codepen.io/).
[License](http://codepen.io/leemark/pen/KmKoPy/license).
View customeventpolyfill.js
(function () {
if ( typeof window.CustomEvent === "function" ) return false;
function CustomEvent ( event, params ) {
params = params || { bubbles: false, cancelable: false, detail: undefined };
var evt = document.createEvent( 'CustomEvent' );
evt.initCustomEvent( event, params.bubbles, params.cancelable, params.detail );
return evt;
}
@leemark
leemark / gist:11237860
Last active Nov 21, 2016
prefixed CSS for slideshow example
View gist:11237860
/* http://themarklee.com/2013/10/16/simple-crossfading-slideshow-css/ */
.css-slideshow {
position: relative;
max-width: 495px;
height: 370px;
margin: 1em auto .5em auto;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
}
.css-slideshow figure {
View some positive bot-thoughts, tracery json
{
"origin": ["#positives# :)"],
"positives" : ["You are the hero of your own story. If you don't like your story, change it! ",
"Life is not about the end result, it's about the journey. Build. Create. Enjoy.",
"The worst-case scenario is never as bad, or as likely, as you think.",
"Struggle, turmoil, and failure all dissolve as soon as they are in the past. They're gone.",
"Challenges are the universe's way of indicating that your goals are worth pursuing.",
"Your time is limited, so don't waste it living someone else's life, pursuing someone else's dream.",
"Don't let other people's noise drown out your own voice.",
"Fear is just a feeling, embrace the feeling, experience it, accept it, then push through it. ",
@leemark
leemark / jsbin.UmUSAJa.html
Created Nov 26, 2013
JavaScript convert string to number: parseInt vs. parseFloat vs. unary operator
View jsbin.UmUSAJa.html
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="JavaScript convert string to number: parseInt vs. parseFloat vs. unary op" /><meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
</body>
</html>
@leemark
leemark / style.css
Created Oct 31, 2013
A Pen by Mark Lee.
View style.css
body{
min-height: 100vh;
min-width: 100vw;
background-color: #000;
background-image:url('http://imgur.com/Mcj5wR3.jpg');
background-size: cover;
background-repeat: no-repeat;
animation: slides 120s infinite;
}
@keyframes slides{