Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Loading example

  • Loading branch information...
commit 14cebfbacdb061f6375160cafe072d2464c9380b 1 parent 714e25a
@screeley screeley authored
Showing with 94 additions and 0 deletions.
  1. BIN  examples/img/loading.gif
  2. +94 −0 examples/loading.html
View
BIN  examples/img/loading.gif
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
94 examples/loading.html
@@ -0,0 +1,94 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <link rel="shortcut icon" href="http://embed.ly/static/favicon.ico">
+ <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript" ></script>
+ <script type="text/javascript" src="../jquery.embedly.js"></script>
+ <link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap-1.2.0.min.css">
+ <link rel="stylesheet" href="css/styles.css" />
+ <title>Embedly jQuery - Loading</title>
+ <style>
+ .topbar{
+ position:relative;
+ }
+ .video {
+ width:500px;
+ }
+ .loading {
+ margin: 20px auto;
+ width: 66px;
+ }
+ </style>
+ </head>
+ <body>
+ <div class="topbar">
+ <div class="topbar-inner">
+ <div class="container">
+ <h3><a href="index.html">Embedly jQuery</a></h3>
+ <ul>
+ <li><a href="photos.html">Photos</a></li>
+ <li><a href="rich.html">Rich</a></li>
+ <li><a href="twitter.html">Twitter</a></li>
+ <li><a href="embed.html">Embed</a></li>
+ <li><a href="videos.html">Videos</a></li>
+ <li><a href="autoplay.html">Autoplay</a></li>
+ <li class="active" ><a href="loading.html">Loading</a></li>
+ </ul>
+ </div>
+ </div>
+ </div>
+ <div class="container">
+ <div class="row">
+ <div class="span10 columns offset3">
+ <h1>Loading</h1>
+ <p>
+ This demo allows users to show a loading image while Embedly
+ fetches the data and then display the content.
+ </p>
+ <h2 class="example">demo</h2>
+ <div class="video">
+ <div class="loading"><img src="img/loading.gif"/></div>
+ <a href="http://vimeo.com/18150336">Video</a>
+ </div>
+ <h2 class="code">code</h2>
+ <code>
+<pre>
+ &lt;div class="video"&gt;
+ &lt;div class="loading"&gt;&lt;img src="img/loading.gif"/&gt;&lt;/div&gt;
+ &lt;a href="http://vimeo.com/18150336"&gt;Video&lt;/a&gt;
+ &lt;/div&gt;
+ &lt;script&gt;
+ $(document).ready(function() {
+ $('.loading').show();
+ $(".video a").embedly({maxWidth: 500,
+ key : 'Your Embedly Key',
+ method : 'replace'}).bind('embedly-oembed', function(e){
+ $('.loading').hide();
+ });
+ });
+ &gt;/script&gt;
+</pre>
+ </code>
+ </ul>
+ </div>
+ </div>
+ <div class="row">
+ <div id="feed" class="span10 columns offset3">
+
+ </div>
+ </div>
+ <div class="clear"></div>
+ </div>
+ <script type="text/javascript">
+ $(document).ready(function() {
+ $(".video a").embedly({maxWidth: 500,
+ key : '4d1f889c20ed11e1abb14040d3dc5c07',
+ method : 'replace'}).bind('embedly-oembed', function(e){
+ $('.loading').hide();
+ });
+ });
+ </script>
+ </body>
+</html>
+
+
Please sign in to comment.
Something went wrong with that request. Please try again.