Adding bower_components to _site, they wont be gitignored
This commit is contained in:
Open-Steps.org
parent
8038a31de7
commit
2824ba5aaf
274 changed files with 46334 additions and 3 deletions
13
_site/bower_components/imagefill.js/README.md
vendored
Normal file
13
_site/bower_components/imagefill.js/README.md
vendored
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
# imagefill.js
|
||||
## The jQuery plugin for making an image fill its container (and be centered)
|
||||
by [John Polacek](http://johnpolacek.com)
|
||||
|
||||
See demo and documentation at the [project page](http://johnpolacek.github.io/imagefill.js)
|
||||
|
||||
* * *
|
||||
#### follow [@johnpolacek](https://twitter.com/johnpolacek)
|
||||
* * *
|
||||
|
||||
|
||||
## Legal
|
||||
Author & copyright (c) 2013: [John Polacek](http://johnpolacek.com), Dual MIT & GPL license
|
||||
1
_site/bower_components/imagefill.js/css/grid.css
vendored
Normal file
1
_site/bower_components/imagefill.js/css/grid.css
vendored
Normal file
File diff suppressed because one or more lines are too long
123
_site/bower_components/imagefill.js/css/main.css
vendored
Executable file
123
_site/bower_components/imagefill.js/css/main.css
vendored
Executable file
|
|
@ -0,0 +1,123 @@
|
|||
/*! normalize.css v1.1.0 | MIT License | git.io/normalize */
|
||||
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block;*display:inline;*zoom:1}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html,button,input,select,textarea{font-family:sans-serif}body{margin:0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}h2{font-size:1.5em;margin:.83em 0}h3{font-size:1.17em;margin:1em 0}h4{font-size:1em;margin:1.33em 0}h5{font-size:.83em;margin:1.67em 0}h6{font-size:.67em;margin:2.33em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}blockquote{margin:1em 40px}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}p,pre{margin:1em 0}code,kbd,pre,samp{font-family:monospace,serif;_font-family:'courier new',monospace;font-size:1em}pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word}q{quotes:none}q:before,q:after{content:'';content:none}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}dl,menu,ol,ul{margin:1em 0}dd{margin:0 0 0 40px}menu,ol,ul{padding:0 0 0 40px}nav ul,nav ol{list-style:none;list-style-image:none}img{border:0;-ms-interpolation-mode:bicubic}svg:not(:root){overflow:hidden}figure{margin:0}form{margin:0}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0;white-space:normal;*margin-left:-7px}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle}button,input{line-height:normal}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;*overflow:visible}button[disabled],html input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;*height:13px;*width:13px}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}
|
||||
/* H5BP */
|
||||
html,button,input,select,textarea{color:#222;}body{font-size:1em;line-height:1.4;}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0;}img{vertical-align:middle;}fieldset{border:0;margin:0;padding:0;}textarea{resize:vertical;}.chromeframe{background:#ccc;color:#000;margin:.2em 0;padding:.2em 0;}::-moz-selection,::selection{background:#b3d4fc;text-shadow:none;}
|
||||
|
||||
.wrapper {
|
||||
width: 640px;
|
||||
margin: 0 auto;
|
||||
padding: 40px;
|
||||
}
|
||||
h1,h2,h3,h4,h5,h6,p {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
h1,h2,h3,h4,h5,h6 {
|
||||
font-family: 'Patua One', sans-serif;
|
||||
}
|
||||
h1 {
|
||||
font-size: 48px;
|
||||
}
|
||||
.block {
|
||||
padding-bottom: 20px;
|
||||
width: 100%;
|
||||
}
|
||||
a, a:hover, a:visited {
|
||||
color: #20A6DB;
|
||||
font-weight: bold;
|
||||
}
|
||||
header,footer {
|
||||
text-align: center;
|
||||
width: 480px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
footer {
|
||||
margin-top: 40px;
|
||||
}
|
||||
pre {
|
||||
border: solid 1px #ccc;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
.imagefill-icon img {
|
||||
padding: 8px;
|
||||
border: solid 4px #ccc;
|
||||
border-radius: 8px;
|
||||
}
|
||||
.simple-demo {
|
||||
width: 240px;
|
||||
height: 240px;
|
||||
margin: 0 auto 40px;
|
||||
border: solid 4px #ccc;
|
||||
border-radius: 8px;
|
||||
}
|
||||
.grid-demo {
|
||||
margin: 0 auto;
|
||||
border: solid 2px #ccc;
|
||||
}
|
||||
.grid-quarter {
|
||||
height: 120px;
|
||||
border: solid 2px #ccc;
|
||||
}
|
||||
.sizes-example {
|
||||
float: left;
|
||||
border: solid 2px #ccc;
|
||||
margin-left: 1%;
|
||||
}
|
||||
.sizes-example1 {
|
||||
width: 19%;
|
||||
height: 120px;
|
||||
}
|
||||
.sizes-example2 {
|
||||
width: 36%;
|
||||
height: 60px;
|
||||
}
|
||||
.sizes-example3 {
|
||||
width: 9%;
|
||||
height: 180px;
|
||||
}
|
||||
.sizes-example4 {
|
||||
width: 29%;
|
||||
height: 150px;
|
||||
}
|
||||
.no-fouc .loading {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* responsive demo */
|
||||
.responsive-demo .image-square { height: 240px; }
|
||||
@media (min-width: 481px) and (max-width: 800px) {
|
||||
.responsive-demo .image-square { height: 180px; }
|
||||
}
|
||||
@media (max-width: 480px) {
|
||||
.responsive-demo .image-square { height: 120px; }
|
||||
}
|
||||
|
||||
/* packery demo - via http://codepen.io/desandro/pen/nfkth */
|
||||
.packery { margin: 0 auto; }
|
||||
.gutter-sizer { width: 2%; }
|
||||
.grid-sizer { width: 18.4%; }
|
||||
.item {
|
||||
width: 150px;
|
||||
height: 60px;
|
||||
float: left;
|
||||
background: #C09;
|
||||
border: 4px solid #333;
|
||||
border-color: hsla(0, 0%, 0%, 0.3);
|
||||
}
|
||||
.item.w2 { width: 320px; background: #9C0; }
|
||||
.item.h2 { height: 120px; background: #0C9; }
|
||||
|
||||
|
||||
/* Helpers */
|
||||
.ir{background-color:transparent;border:0;overflow:hidden;text-indent:-9999px;}
|
||||
.ir:before{content:"";display:block;width:0;height:150%;}
|
||||
.hidden{display:none!important;visibility:hidden;}
|
||||
.visuallyhidden{border:0;clip:rect(0000);height:1px;overflow:hidden;position:absolute;width:1px;margin:-1px;padding:0;}
|
||||
.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{clip:auto;height:auto;overflow:visible;position:static;width:auto;margin:0;}
|
||||
.invisible{visibility:hidden;}
|
||||
.clearfix:before,.clearfix:after{content:" ";display:table;}
|
||||
.clearfix:after{clear:both;}
|
||||
.clearfix{zoom:1;}
|
||||
|
||||
/* Print styles */
|
||||
@media print{*{background:transparent!important;color:#000!important;box-shadow:none!important;text-shadow:none!important;}a,a:visited{text-decoration:underline;}a[href]:after{content:" (" attr(href) ")";}abbr[title]:after{content:" (" attr(title) ")";}.ir a:after,a[href^=javascript:]:after,a[href^=#]:after{content:"";}pre,blockquote{border:1px solid #999;page-break-inside:avoid;}thead{display:table-header-group;}tr,img{page-break-inside:avoid;}img{max-width:100%!important;}@page{margin:.5cm;}p,h2,h3{orphans:3;widows:3;}h2,h3{page-break-after:avoid;}}
|
||||
BIN
_site/bower_components/imagefill.js/img/fill-icon.png
vendored
Normal file
BIN
_site/bower_components/imagefill.js/img/fill-icon.png
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
204
_site/bower_components/imagefill.js/index.html
vendored
Executable file
204
_site/bower_components/imagefill.js/index.html
vendored
Executable file
|
|
@ -0,0 +1,204 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="no-js">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<title>imagefill.js | Project Page</title>
|
||||
<meta name="description" content="imagefill.js - The jQuery plugin for making images fill their containers (and be centered)">
|
||||
<meta name="viewport" content="width=device-width">
|
||||
|
||||
<link href='http://fonts.googleapis.com/css?family=Patua+One' rel='stylesheet' type='text/css'>
|
||||
|
||||
<!-- Extra Strength Responsive Grids https://github.com/dfcb/extra-strength-responsive-grids -->
|
||||
<link rel="stylesheet" href="css/grid.css">
|
||||
<link rel="stylesheet" href="css/main.css">
|
||||
|
||||
<!--[if lt IE 9]>
|
||||
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
||||
<script>window.html5 || document.write('<script src="js/vendor/html5shiv.js"><\/script>')</script>
|
||||
<![endif]-->
|
||||
|
||||
<!-- Prevent FOUC (flash of unstyled content) -->
|
||||
<style type="text/css">
|
||||
.no-fouc {display: none;}
|
||||
</style>
|
||||
|
||||
<script type="text/javascript">
|
||||
document.documentElement.className = 'no-fouc';
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<header>
|
||||
<div class="block">
|
||||
<div class="imagefill-icon">
|
||||
<img src="img/fill-icon.png" alt="">
|
||||
</div>
|
||||
<h1>imagefill.js</h1>
|
||||
</div>
|
||||
<div class="block">
|
||||
<h2>The jQuery plugin for making images fill their containers (and be centered)</h2>
|
||||
<p><small><em>a potentially useful tool for Responsive Web Design</em></small></p>
|
||||
</div>
|
||||
<div class="block">
|
||||
<p>Created by <a href="http://johnpolacek.com" target="_blank">John Polacek</a></p>
|
||||
<div class="follow-btn">
|
||||
<iframe scrolling="no" frameborder="0" allowtransparency="true" src="http://platform.twitter.com/widgets/follow_button.1347008535.html#_=1347293944835&id=twitter-widget-0&lang=en&screen_name=johnpolacek&show_count=false&show_screen_name=true&size=l" class="twitter-follow-button" style="width: 169px; height: 28px;" title="Twitter Follow Button" data-twttr-rendered="true"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<a href="https://github.com/johnpolacek/imagefill.js/"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_red_aa0000.png" alt="Fork me on GitHub"></a>
|
||||
|
||||
<div class="simple-demo">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" class="loading" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
|
||||
<div class="block">
|
||||
<h3>Download</h3>
|
||||
<p>Source files <a href="https://github.com/johnpolacek/imagefill.js/" target="_blank">on github</a> or <a href="https://github.com/johnpolacek/imagefill.js/zipball/master/" target="_blank">download the zip</a>.</p>
|
||||
</div>
|
||||
|
||||
<div class="block">
|
||||
<h3>Simple Example</h3>
|
||||
<p>Given this html:</p>
|
||||
<pre><div class="container"><img src="myawesomeimage" /></div></pre>
|
||||
<p>Do this:</p>
|
||||
<pre>$('.container').imagefill();
|
||||
// image stretches to fill container</pre>
|
||||
</div>
|
||||
|
||||
<div class="block">
|
||||
<h3>Grid Example</h3>
|
||||
<p>Given a grid like this:</p>
|
||||
<pre><div class="grid-whole">
|
||||
<div class="grid-quarter">
|
||||
<img src="myawesomeimage.jpg">
|
||||
</div>
|
||||
<div class="grid-quarter">
|
||||
<img src="myawesomeimage.jpg">
|
||||
</div>
|
||||
<div class="grid-quarter">
|
||||
<img src="myawesomeimage.jpg">
|
||||
</div>
|
||||
<div class="grid-quarter">
|
||||
<img src="myawesomeimage.jpg">
|
||||
</div>
|
||||
</div></pre>
|
||||
<p>Do this:</p>
|
||||
<pre>$('.grid-quarter').imagefill();
|
||||
// image stretches to fill container</pre>
|
||||
<div class="block clearfix">
|
||||
<div class="grid-demo">
|
||||
<div class="grid-quarter">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" class="loading" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="grid-quarter">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" class="loading" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="grid-quarter">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" class="loading" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="grid-quarter">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" class="loading" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p>Check out <a href="responsive.html" target="_blank">this simple responsive grid example</a>.</p>
|
||||
</div>
|
||||
|
||||
<div class="block">
|
||||
<h3>Different Sizes Example</h3>
|
||||
<p>Given images that vary in sizes, for example using jQuery Masonry or Packery, do this:</p>
|
||||
<pre>$('.item').imagefill();
|
||||
// image stretches to fill container</pre>
|
||||
<div class="block clearfix">
|
||||
<div class="sizes-demo">
|
||||
<div class="sizes-example sizes-example1">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" class="loading" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="sizes-example sizes-example2">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" class="loading" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="sizes-example sizes-example3">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" class="loading" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="sizes-example sizes-example4">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" class="loading" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p>Check out <a href="packery.html" target="_blank">this simple packery example</a> which is also a nice use case for the <code>{runOnce:true}</code> option.</p>
|
||||
</div>
|
||||
|
||||
<div class="block">
|
||||
<h3>Options</h3>
|
||||
<p><strong>runOnce</strong><br>
|
||||
Imagefill continuously checks to see if the size of the image container changes, then it adjusts the size of the image inside. To only run once, set to false.
|
||||
</p>
|
||||
<pre>$('.img-container').imagefill({runOnce:true});</pre>
|
||||
<p><strong>throttle</strong><br>
|
||||
Imagefill continuously checks to see if the size of the image container changes, then it adjusts the size of the image inside. This option lets you adjust the frequency of this check (default is 100ms). To run at a higher frequency, such as for an animation rate like 60fps, do this:</p>
|
||||
<pre>$('.animating-container').imagefill({throttle:1000/60})</pre>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="block">
|
||||
<h3>Requires:</h3>
|
||||
<ul>
|
||||
<li><a href="https://github.com/desandro/imagesloaded">imagesLoaded</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="block">
|
||||
<h3>If you like imagefill.js, you might also like:</h3>
|
||||
<ul>
|
||||
<li><a href="http://packery.metafizzy.co/">Packery</a> - The bin-packing layout library that is from the same <a href="https://github.com/desandro">mad genius</a> who created jQuery <a href="http://masonry.desandro.com/">Masonry</a> and <a href="http://isotope.metafizzy.co/">isotope</a>.</li>
|
||||
<li><a href="https://github.com/tsvensen/equalize.js/">equalize.js</a> - The jQuery plugin for equalizing the height or width of your elements</li>
|
||||
<li><a href="http://dfcb.github.io/extra-strength-responsive-grids/">Extra Strength Responsive Grids</a> - The Fluid CSS Grid System for Responsive Web Design. Take total control of your layouts.</li>
|
||||
<li><a href="http://johnpolacek.github.io/stacktable.js/">stacktable.js</a> - jQuery plugin for stacking tables on small screens.</li>
|
||||
<li><a href="http://johnpolacek.com/2012/10/03/help-prevent-fouc/">Prevent FOUC</a> - Prevent FOUC with 2 easy steps.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
|
||||
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.1.min.js"><\/script>')</script>
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery.imagesloaded/2.1.0/jquery.imagesloaded.min.js"></script>
|
||||
<script src="js/jquery-imagefill.js"></script>
|
||||
<script>
|
||||
|
||||
// SIMPLE DEMO
|
||||
$('.simple-demo')
|
||||
// call image fill throttled to 30 fps (default is only 10 fps, works for most situations)
|
||||
.imagefill({throttle:1000/60})
|
||||
// add looped animation queue
|
||||
.queue(function(next) {
|
||||
$(this).animate({width:640},2000).delay(2000).animate({width:90},2000).delay(2000);
|
||||
$(this).queue(arguments.callee);
|
||||
next();
|
||||
});
|
||||
|
||||
// GRID DEMO
|
||||
$('.grid-quarter').imagefill();
|
||||
$('.grid-demo').queue(function(next) {
|
||||
$(this).animate({width:320},4000).animate({width:640},4000);
|
||||
$(this).queue(arguments.callee);
|
||||
next();
|
||||
});
|
||||
|
||||
// VARIED SIZES EXAMPLE
|
||||
$('.sizes-example').imagefill({runOnce:true});
|
||||
|
||||
// Prevent FOUC
|
||||
$('.no-fouc').removeClass('no-fouc');
|
||||
</script>
|
||||
|
||||
<script>
|
||||
var _gaq=[['_setAccount','UA-2821890-9'],['_trackPageview']];
|
||||
(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
|
||||
g.src='//www.google-analytics.com/ga.js';
|
||||
s.parentNode.insertBefore(g,s)}(document,'script'));
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
104
_site/bower_components/imagefill.js/js/jquery-imagefill.js
vendored
Executable file
104
_site/bower_components/imagefill.js/js/jquery-imagefill.js
vendored
Executable file
|
|
@ -0,0 +1,104 @@
|
|||
/**
|
||||
* imagefill.js
|
||||
* Author & copyright (c) 2013: John Polacek
|
||||
* johnpolacek.com
|
||||
* https://twitter.com/johnpolacek
|
||||
*
|
||||
* Dual MIT & GPL license
|
||||
*
|
||||
* Project Page: http://johnpolacek.github.io/imagefill.js
|
||||
*
|
||||
* The jQuery plugin for making images fill their containers (and be centered)
|
||||
*
|
||||
* EXAMPLE
|
||||
* Given this html:
|
||||
* <div class="container"><img src="myawesomeimage" /></div>
|
||||
* $('.container').imagefill(); // image stretches to fill container
|
||||
*
|
||||
* REQUIRES:
|
||||
* imagesLoaded - https://github.com/desandro/imagesloaded
|
||||
*
|
||||
*/
|
||||
;(function($) {
|
||||
|
||||
$.fn.imagefill = function(options) {
|
||||
|
||||
var $container = this,
|
||||
$img = $container.find('img').addClass('loading').css({'position':'absolute'}),
|
||||
imageAspect = 1/1,
|
||||
containersH = 0,
|
||||
containersW = 0,
|
||||
defaults = {
|
||||
runOnce: false,
|
||||
throttle : 200 // 5fps
|
||||
},
|
||||
settings = $.extend({}, defaults, options);
|
||||
|
||||
// make sure container isn't position:static
|
||||
var containerPos = $container.css('position');
|
||||
$container.css({'overflow':'hidden','position':(containerPos === 'static') ? 'relative' : containerPos});
|
||||
|
||||
// set containerH, containerW
|
||||
$container.each(function() {
|
||||
containersH += $(this).outerHeight();
|
||||
containersW += $(this).outerWidth();
|
||||
});
|
||||
|
||||
// wait for image to load, then fit it inside the container
|
||||
$container.imagesLoaded().done(function(img) {
|
||||
imageAspect = $img.width() / $img.height();
|
||||
$img.removeClass('loading');
|
||||
fitImages();
|
||||
if (!settings.runOnce) {
|
||||
checkSizeChange();
|
||||
}
|
||||
});
|
||||
|
||||
function fitImages() {
|
||||
containersH = 0;
|
||||
containersW = 0;
|
||||
$container.each(function() {
|
||||
imageAspect = $(this).find('img').width() / $(this).find('img').height();
|
||||
var containerW = $(this).outerWidth(),
|
||||
containerH = $(this).outerHeight();
|
||||
containersH += $(this).outerHeight();
|
||||
containersW += $(this).outerWidth();
|
||||
|
||||
var containerAspect = containerW/containerH;
|
||||
if (containerAspect < imageAspect) {
|
||||
// taller
|
||||
$(this).find('img').css({
|
||||
width: 'auto',
|
||||
height: containerH,
|
||||
top:0,
|
||||
left:-(containerH*imageAspect-containerW)/2
|
||||
});
|
||||
} else {
|
||||
// wider
|
||||
$(this).find('img').css({
|
||||
width: containerW,
|
||||
height: 'auto',
|
||||
top:-(containerW/imageAspect-containerH)/2,
|
||||
left:0
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function checkSizeChange() {
|
||||
var checkW = 0,
|
||||
checkH = 0;
|
||||
$container.each(function() {
|
||||
checkH += $(this).outerHeight();
|
||||
checkW += $(this).outerWidth();
|
||||
});
|
||||
if (containersH !== checkH || containersW !== checkW) {
|
||||
fitImages();
|
||||
}
|
||||
setTimeout(checkSizeChange, settings.throttle);
|
||||
}
|
||||
|
||||
return this;
|
||||
};
|
||||
|
||||
}(jQuery));
|
||||
5
_site/bower_components/imagefill.js/js/vendor/html5shiv.js
vendored
Executable file
5
_site/bower_components/imagefill.js/js/vendor/html5shiv.js
vendored
Executable file
|
|
@ -0,0 +1,5 @@
|
|||
(function(l,f){function m(){var a=e.elements;return"string"==typeof a?a.split(" "):a}function i(a){var b=n[a[o]];b||(b={},h++,a[o]=h,n[h]=b);return b}function p(a,b,c){b||(b=f);if(g)return b.createElement(a);c||(c=i(b));b=c.cache[a]?c.cache[a].cloneNode():r.test(a)?(c.cache[a]=c.createElem(a)).cloneNode():c.createElem(a);return b.canHaveChildren&&!s.test(a)?c.frag.appendChild(b):b}function t(a,b){if(!b.cache)b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag();
|
||||
a.createElement=function(c){return!e.shivMethods?b.createElem(c):p(c,a,b)};a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+m().join().replace(/\w+/g,function(a){b.createElem(a);b.frag.createElement(a);return'c("'+a+'")'})+");return n}")(e,b.frag)}function q(a){a||(a=f);var b=i(a);if(e.shivCSS&&!j&&!b.hasCSS){var c,d=a;c=d.createElement("p");d=d.getElementsByTagName("head")[0]||d.documentElement;c.innerHTML="x<style>article,aside,figcaption,figure,footer,header,hgroup,nav,section{display:block}mark{background:#FF0;color:#000}</style>";
|
||||
c=d.insertBefore(c.lastChild,d.firstChild);b.hasCSS=!!c}g||t(a,b);return a}var k=l.html5||{},s=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,r=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,j,o="_html5shiv",h=0,n={},g;(function(){try{var a=f.createElement("a");a.innerHTML="<xyz></xyz>";j="hidden"in a;var b;if(!(b=1==a.childNodes.length)){f.createElement("a");var c=f.createDocumentFragment();b="undefined"==typeof c.cloneNode||
|
||||
"undefined"==typeof c.createDocumentFragment||"undefined"==typeof c.createElement}g=b}catch(d){g=j=!0}})();var e={elements:k.elements||"abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup mark meter nav output progress section summary time video",shivCSS:!1!==k.shivCSS,supportsUnknownElements:g,shivMethods:!1!==k.shivMethods,type:"default",shivDocument:q,createElement:p,createDocumentFragment:function(a,b){a||(a=f);if(g)return a.createDocumentFragment();
|
||||
for(var b=b||i(a),c=b.frag.cloneNode(),d=0,e=m(),h=e.length;d<h;d++)c.createElement(e[d]);return c}};l.html5=e;q(f)})(this,document);
|
||||
6
_site/bower_components/imagefill.js/js/vendor/jquery-1.10.1.min.js
vendored
Executable file
6
_site/bower_components/imagefill.js/js/vendor/jquery-1.10.1.min.js
vendored
Executable file
File diff suppressed because one or more lines are too long
141
_site/bower_components/imagefill.js/packery.html
vendored
Executable file
141
_site/bower_components/imagefill.js/packery.html
vendored
Executable file
|
|
@ -0,0 +1,141 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="no-js">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<title>imagefill.js | Packery Example</title>
|
||||
<meta name="description" content="imagefill.js - The jQuery plugin for making an image fill its container (and be centered)">
|
||||
<meta name="viewport" content="width=device-width">
|
||||
|
||||
<link href='http://fonts.googleapis.com/css?family=Patua+One' rel='stylesheet' type='text/css'>
|
||||
|
||||
<link rel="stylesheet" href="css/main.css">
|
||||
|
||||
<!--[if lt IE 9]>
|
||||
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
||||
<script>window.html5 || document.write('<script src="js/vendor/html5shiv.js"><\/script>')</script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body>
|
||||
<header class="block">
|
||||
<div class="block">
|
||||
<h1>Packery Example</h1>
|
||||
<h3>(via <a href="http://codepen.io/desandro/pen/nfkth">this Codepen</a>)</h3>
|
||||
</div>
|
||||
<div class="block">
|
||||
<p>Don’t know about <a href="http://packery.metafizzy.co/">Packery</a>? It is the bin-packing layout library that is from the same <a href="https://github.com/desandro">mad genius</a> who created jQuery <a href="http://masonry.desandro.com/">Masonry</a> and <a href="http://isotope.metafizzy.co/">isotope</a>.</p>
|
||||
</div>
|
||||
<div class="block">
|
||||
<h2>Resize your browser window to see the magic</h2>
|
||||
</div>
|
||||
</header>
|
||||
<div class="packery clearfix">
|
||||
<div class="gutter-sizer"></div>
|
||||
<div class="grid-sizer"></div>
|
||||
<div class="item w2">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="item w2 h2">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="item w2">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="item h2">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="item h2">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="item h2">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
</div>
|
||||
<footer>
|
||||
<p><small><em><a href="index.html">Back to imagefill.js</a></em></small></p>
|
||||
</footer>
|
||||
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
|
||||
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.1.min.js"><\/script>')</script>
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery.imagesloaded/2.1.0/jquery.imagesloaded.min.js"></script>
|
||||
<script src="http://packery.metafizzy.co/packery.pkgd.min.js"></script>
|
||||
<script src="js/jquery-imagefill.js"></script>
|
||||
<script>
|
||||
// http://packery.metafizzy.co/packery.pkgd.js added as external resource
|
||||
|
||||
$( function() {
|
||||
var $container = $('.packery').packery({
|
||||
itemSelector: '.item',
|
||||
columnWidth: 150,
|
||||
gutter: 20,
|
||||
// disable resize
|
||||
isResizeBound: false
|
||||
});
|
||||
|
||||
var pckry = $container.data('packery');
|
||||
|
||||
var gutter = pckry.options.gutter || 0;
|
||||
var columnWidth = pckry.options.columnWidth + gutter;
|
||||
|
||||
function onResize() {
|
||||
var outsideSize = getSize( $container.parent()[0] ).innerWidth;
|
||||
var cols = Math.floor( outsideSize / ( columnWidth ) );
|
||||
// set container width to columns
|
||||
$container.width( cols * columnWidth - gutter )
|
||||
// manually trigger layout
|
||||
$container.packery();
|
||||
// run imagefill inside the resize event, using runOnce
|
||||
$('.item').imagefill({runOnce:true});
|
||||
}
|
||||
|
||||
// debounce resize event
|
||||
var resizeTimeout;
|
||||
$( window ).on( 'resize', function() {
|
||||
if ( resizeTimeout ) {
|
||||
clearTimeout( resizeTimeout );
|
||||
}
|
||||
resizeTimeout = setTimeout( onResize, 100 );
|
||||
})
|
||||
|
||||
// initial trigger
|
||||
onResize();
|
||||
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<script>
|
||||
var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];
|
||||
(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
|
||||
g.src='//www.google-analytics.com/ga.js';
|
||||
s.parentNode.insertBefore(g,s)}(document,'script'));
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
76
_site/bower_components/imagefill.js/responsive.html
vendored
Executable file
76
_site/bower_components/imagefill.js/responsive.html
vendored
Executable file
|
|
@ -0,0 +1,76 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="no-js">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<title>imagefill.js | Responsive Example</title>
|
||||
<meta name="description" content="imagefill.js - The jQuery plugin for making an image fill its container (and be centered)">
|
||||
<meta name="viewport" content="width=device-width">
|
||||
|
||||
<link href='http://fonts.googleapis.com/css?family=Patua+One' rel='stylesheet' type='text/css'>
|
||||
|
||||
<!-- Extra Strength Responsive Grids https://github.com/dfcb/extra-strength-responsive-grids -->
|
||||
<link rel="stylesheet" href="css/grid.css">
|
||||
<link rel="stylesheet" href="css/main.css">
|
||||
|
||||
<!--[if lt IE 9]>
|
||||
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
||||
<script>window.html5 || document.write('<script src="js/vendor/html5shiv.js"><\/script>')</script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
<body>
|
||||
<div class="grid-whole responsive-demo">
|
||||
<div class="image-square grid-quarter m-grid-third s-grid-half">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="image-square grid-quarter m-grid-third s-grid-half">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="image-square grid-quarter m-grid-third s-grid-half">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="image-square grid-quarter m-grid-third s-grid-half">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="image-square grid-quarter m-grid-third s-grid-half">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="image-square grid-quarter m-grid-third s-grid-half">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="image-square grid-quarter m-grid-third s-grid-half">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="image-square grid-quarter m-grid-third s-grid-half">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="image-square grid-quarter m-grid-third s-grid-half">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="image-square grid-quarter m-grid-third s-grid-half">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="image-square grid-quarter m-grid-third s-grid-half">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
<div class="image-square grid-quarter m-grid-third s-grid-half">
|
||||
<img src="http://octodex.github.com/images/daftpunktocat-thomas.gif" alt="Octocat Github Mascot">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
|
||||
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.1.min.js"><\/script>')</script>
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery.imagesloaded/2.1.0/jquery.imagesloaded.min.js"></script>
|
||||
<script src="js/jquery-imagefill.js"></script>
|
||||
<script>
|
||||
$('.grid-quarter').imagefill();
|
||||
</script>
|
||||
|
||||
<script>
|
||||
var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];
|
||||
(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
|
||||
g.src='//www.google-analytics.com/ga.js';
|
||||
s.parentNode.insertBefore(g,s)}(document,'script'));
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue