Skip to content

Instantly share code, notes, and snippets.

View albell's full-sized avatar

Alex Bell albell

7 followers · 6 following
View GitHub Profile
@albell
albell / progressive-kitties01
Created March 2, 2013 02:13
demo of cycle2 progressive loading bug
<!doctype html>
<html lang="en">
<head>
<meta charset='utf-8' />
<meta name="viewport" content="width=device-width">
<meta name='description' content='' />
<title></title>
<style>
.cycle-slideshow {
@albell
albell / progressive kitties 2
Created March 4, 2013 23:44
progressive loading issues with cycle2
<!doctype html>
<html lang="en">
<head>
<meta charset='utf-8' />
<meta name="viewport" content="width=device-width">
<meta name='description' content='' />
<title></title>
<style>
.cycle-slideshow {
@albell
albell / window resizing and autoheight in cycle2
Created March 9, 2013 00:35
<!doctype html>
<html lang="en">
<head>
<meta charset='utf-8' />
<meta name="viewport" content="width=device-width">
<meta name='description' content='' />
<title></title>
<style>
.cycle-slideshow {
@albell
albell / markup.html
Created March 15, 2013 22:23
<div id="myshow" class="cycle-slideshow" data-cycle-pager="#pager-container">
<img src="img1.jpg"/>
<img src="img2.jpg"/>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" data-img="img3.jpg"/>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" data-img="img4.jpg"/>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" data-img="img5.jpg"/>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" data-img="img6.jpg"/>
</div>
<div id="pager-container"></div>
@albell
albell / markup.html
Created March 15, 2013 22:24
<div id="myshow" class="cycle-slideshow" data-cycle-pager="#pager-container">
<img src="img1.jpg"/>
<img src="img2.jpg"/>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" data-img="img3.jpg"/>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" data-img="img4.jpg"/>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" data-img="img5.jpg"/>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" data-img="img6.jpg"/>
</div>
<div id="pager-container"></div>
@albell
albell / markup.html
Last active December 15, 2015 00:29
<div class="cycle-slideshow"
data-slides=">div"
data-cycle-auto-height="calc"
>
<div>
<img src="img1.jpg" width="###" height="###">
<p>caption 1</p>
</div>
<div>
<img src="img2.jpg" width="###" height="###">
@albell
albell / VideoJS dims
Last active August 29, 2015 14:06
Dimension test bed for VideoJS (pseudocode)
1) No Dims.
<video data-setup=“{}” preload=“none”>
check:
player is visible
player has class “vjs-default-dimensions”
player width is 300.
player height is 150.
// I would like to handle this as a special case. Introducing 300 and 150 as
// independent default values, as is currently done, creates serious complexities.
@albell
albell / gist:d0f2b79d8b67da2cb0ea
Created March 6, 2015 23:33
Foundation CSS for button element
button, .button {
border-style: solid;
border-width: 0;
cursor: pointer;
font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
font-weight: normal;
line-height: normal;
margin: 0 0 1.25rem;
position: relative;
text-decoration: none;
@albell
albell / assemblefile.js
Created February 3, 2017 20:13
/* eslint no-param-reassign: ["off"] */
/* eslint import/no-extraneous-dependencies: ["error", {"devDependencies": true,
"optionalDependencies": false, "peerDependencies": false}] */
/**
* Assemble has first-class support for vinyl-fs, so any gulp plugin can be used
* directly in the assemble pipeline.
*/