Skip to content

Instantly share code, notes, and snippets.

Web Apprentice webapprentice

Block or report user

Report or block webapprentice

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@webapprentice
webapprentice / tutorial_1_example_1.html
Last active Dec 27, 2015
Simple example of embedding a Google Map in a web page
View tutorial_1_example_1.html
<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=eiffel+tower,+Paris,+France&amp;aq=t&amp;sll=47.613028,-122.342064&amp;sspn=0.367071,0.644073&amp;ie=UTF8&amp;hq=&amp;hnear=&amp;t=m&amp;iwloc=A&amp;ll=48.858228,2.294388&amp;spn=0.006295,0.006295&amp;output=embed"></iframe>
<br />
<small>
<a href="https://maps.google.com/maps?f=q&amp;source=embed&amp;hl=en&amp;geocode=&amp;q=eiffel+tower,+Paris,+France&amp;aq=t&amp;sll=47.613028,-122.342064&amp;sspn=0.367071,0.644073&amp;ie=UTF8&amp;hq=&amp;hnear=&amp;t=m&amp;iwloc=A&amp;ll=48.858228,2.294388&amp;spn=0.006295,0.006295" style="color:#0000FF;text-align:left">View Larger Map</a>
</small>
@webapprentice
webapprentice / tutorial_2_example_1.html
Created Nov 7, 2013
Example of code to embed a single tweet in a web page
View tutorial_2_example_1.html
<blockquote class="twitter-tweet">
<p>Brazil to export low-cost measles &amp; rubella vaccines to developing countries
<a href="http://t.co/moEfOssAqQ">http://t.co/moEfOssAqQ</a>
</p>
&mdash; BBC News (World) (@BBCWorld)
<a href="https://twitter.com/BBCWorld/statuses/395287088033447936">October 29, 2013</a>
</blockquote>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
@webapprentice
webapprentice / tutorial_3_example_1.html
Last active Dec 27, 2015
Embed a Weather Forecast from forecast.io in a web page
View tutorial_3_example_1.html
<iframe id="forecast_embed" type="text/html" frameborder="0" height="245" width="75%"
src="http://forecast.io/embed/#lat=69.649205&lon=18.955324&name=Tromso, Norway&color=#00aaff&font=Helvetica&units=us">
</iframe>
@webapprentice
webapprentice / tutorial_4_example_1.html
Created Nov 7, 2013
Embed a YouTube video in your web page
View tutorial_4_example_1.html
<iframe width="420" height="315" src="//www.youtube.com/embed/vzeBDcmrjjY" frameborder="0" allowfullscreen></iframe>
@webapprentice
webapprentice / tutorial_5_example_1.html
Created Nov 7, 2013
Use the <audio> tag to play an audio file in a web page
View tutorial_5_example_1.html
<audio autoplay="autoplay" controls="controls">
<source src="/assets/Doctor_Who_theme_excerpt.ogg" />
<p>Your browser does not support the audio element.</p>
</audio>
@webapprentice
webapprentice / tutorial_6_demo_1.html
Last active Dec 27, 2015
Play an audio file using JavaScript
View tutorial_6_demo_1.html
<script>
window.AudioContext = (function(){
return window.webkitAudioContext || window.AudioContext ;
})();
// Global variables
var audioContext;
var audioBuffer = 0;
var audioUrl = "/assets/Doctor_Who_theme_excerpt.ogg";
@webapprentice
webapprentice / tutorial_7_example_1.html
Created Nov 7, 2013
Embed a live updating Twitter Timeline into a web page
View tutorial_7_example_1.html
<a class="twitter-timeline" href="https://twitter.com/BBCWorld" data-widget-id="395313647477481472">Tweets by @BBCWorld</a>
<script>
!function(d,s,id){
var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';
if(!d.getElementById(id)){
js=d.createElement(s);
js.id=id;
js.src=p+"://platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js,fjs);
@webapprentice
webapprentice / tutorial_8_example_1.html
Created Nov 7, 2013
Use Google fonts in a web page
View tutorial_8_example_1.html
<style>
@import url(http://fonts.googleapis.com/css?family=PT+Sans);
@import url(http://fonts.googleapis.com/css?family=Cinzel);
@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed);
@import url(http://fonts.googleapis.com/css?family=Fondamento);
p {
font-size: 18px;
}
.font1 {
@webapprentice
webapprentice / tutorial_9_example_1.html
Created Nov 7, 2013
Embed a video from Vimeo in a web page
View tutorial_9_example_1.html
<iframe src="//player.vimeo.com/video/49643332" width='500' height='281' frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
View tutorial_10_example_1.html
<div>
<iframe width="500" height="400" frameborder="0"
src="http://www.bing.com/maps/embed/viewer.aspx?v=3&cp=48.858601~2.293980&lvl=15&w=500&h=400&sty=r&typ=d&pp=&ps=&dir=0&mkt=en-us&src=SHELL&form=BMEMJS">
</iframe>
<div style="margin: 12px 0 0 0;">
<a target="_blank" href="http://www.bing.com/maps/?cp=48.858601~2.293980&sty=r&lvl=15&sp=&mm_embed=map">View Larger Map</a>&nbsp; |&nbsp;
<a target="_blank" href="http://www.bing.com/maps/?cp=48.858601~2.293980&sty=r&lvl=15&rtp=~pos.48.858601_2.293980____&mm_embed=dir">Get Directions</a>&nbsp; |&nbsp;
<a target="_blank" href="http://www.bing.com/maps/?cp=s48sq3h5r1fn&sty=b&lvl=18&sp=&mm_embed=be">View Bird's Eye</a>
</div>
You can’t perform that action at this time.