Skip to content

Instantly share code, notes, and snippets.

@jwwicks

jwwicks/jsbin.mabuhaci.css

Created May 11, 2014 04:50
Show Gist options
  • Save jwwicks/c780e0033ebd40804202 to your computer and use it in GitHub Desktop.
Save jwwicks/c780e0033ebd40804202 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
jsbin.mabuhaci.css
.flowplayer { width: 80%; }
Raw
jsbin.mabuhaci.html
<!DOCTYPE html>
<html class="no-js" lang="en" >
<head>
<meta name="description" content="Flowplayer in Foundation Orbit" />
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Foundation 5</title>
<link rel="stylesheet" href="//jwwicks.com/files/jsfiddle/css/normalize.css">
<link rel="stylesheet" href="//jwwicks.com/files/jsfiddle/css/foundation.css">
<link rel="stylesheet" type="text/css" href="//jwwicks.com/files/jsfiddle/css/skin/minimalist.css">
<link rel="stylesheet" href="//jwwicks.com/files/jsfiddle/css/app.css">
<script src="//jwwicks.com/files/jsfiddle/js/vendor/modernizr.js"></script>
</head>
<body>
<!-- First Band (Slider) -->
<div class="row">
<div class="large-12 columns">
<ul data-orbit>
<li><img src="http://placehold.it/1000x400&text=[ img 1 ]" /></li>
<li><div class="flowplayer" data-swf="//jwwicks.com/files/jsfiddle/js/flowplayer.swf" data-ratio="0.4167">
<video>
<source type="video/webm" src="//stream.flowplayer.org/bauhaus/624x260.webm">
<source type="video/mp4" src="//stream.flowplayer.org/bauhaus/624x260.mp4">
<source type="video/ogv" src="//stream.flowplayer.org/bauhaus/624x260.ogv">
</video>
</div></li>
<li><img src="http://placehold.it/1000x400&text=[ img 3 ]" /></li>
<li><img src="http://placehold.it/1000x400&text=[ img 4 ]" /></li>
</ul>
</div>
</div>
<!-- Footer -->
<footer class="row">
<div class="large-12 columns">
<hr />
<div class="row">
<div class="large-6 columns">
<p>&copy; Copyright no one at all. Go to town.</p>
</div>
<div class="large-6 columns">
<ul class="inline-list right">
<li><a href="#">Link 1</a></li>
</ul>
</div>
</div>
</div>
</footer>
<script src="//jwwicks.com/files/jsfiddle/js/vendor/jquery.js"></script>
<script src="//jwwicks.com/files/jsfiddle/js/foundation.min.js"></script>
<script src="//jwwicks.com/files/jsfiddle/js/flowplayer.min.js"></script>
<script>
$(document).foundation();
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment