Zipline # 2 for FreeCodeCamp
Last active
August 30, 2015 09:26
-
-
Save tolkadot/ded81feb6f4de674897c to your computer and use it in GitHub Desktop.
Random Quote Machine III
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- FREE CODE CAMP ZIPLINE #2 --> | |
<head> | |
<link href='https://fonts.googleapis.com/css?family=Hind:400,600' rel='stylesheet' type='text/css'> | |
<link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'> | |
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css"> | |
<link href='https://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'> | |
</head> | |
<body> | |
<div class="container-fluid"> | |
<!-- title --> | |
<section class="h1 text-center words"> | |
<div id="fader"> | |
Don't Quote Me </div> | |
</section> | |
<!-- the quote --> | |
<section class="words" id="theQuote"> | |
loading . . | |
</section> | |
<!-- buttons --> | |
<section class="text-center"> | |
<div class="row"> | |
<div class=col-xs-6> | |
<button id="genQuote" class="btn-primary btn-lg text-centre ">Get a better Quote</button> | |
</div> | |
<div class=col-xs-6> | |
<button class="btn-primary btn-lg text-centre "><a href="#" id="tweet" target="_blank"><i class="fa fa-twitter"></i> tweet this</button> </div> | |
</div> | |
</section> | |
</div> | |
</body> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$(document).ready(function() { | |
$('#fader').hide().fadeIn(4000); | |
var quoter = function() { | |
var Q1 = "A quotation is a handy thing to have about, saving one the trouble of thinking for oneself, always a laborious business ― A.A. Milne, If I May"; | |
var Q2 = "Quotation, n: The act of repeating erroneously the words of another ― Ambrose Bierce, The Unabridged Devil's Dictionary"; | |
var Q3 = "He wrapped himself in quotations - as a beggar would enfold himself in the purple of Emperors ― Rudyard Kipling, Many Inventions"; | |
var Q4 = "A facility for quotation covers the absence of original thought - ― Dorothy L. Sayers, Gaudy Night"; | |
var Q5 = "Life itself is a quotation - Jorge Luis Borges"; | |
var Q6 = "A fine quotation is a diamond in the hand of a man of wit and a pebble in the hand of a fool - Joseph Roux"; | |
var arrayOfQuotes = [0, Q1, Q2, Q3, Q4, Q5, Q6]; | |
var randomNumber = Math.floor((Math.random() * 6) + 1); | |
var newQuote = arrayOfQuotes[randomNumber]; | |
return newQuote; | |
} | |
$("#genQuote").click(function() { | |
$("#theQuote").html(quoter()); | |
}); | |
$('#tweet').click(function(event) { | |
var twitter = "https://twitter.com/intent/tweet?text=" + "%22" + encodeURIComponent($('#theQuote').text()) | |
$(this).attr("href", twitter); | |
}); | |
}); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> | |
<script src="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
body { | |
background-image: url(https://image.freepik.com/free-photo/blurry-blurred-blur-background-backdrop-abstract_121-17167.jpg); | |
min-height: 100%; | |
background-size: cover; | |
background-attachment: fixed; | |
background-repeat: no-repeat; | |
background-position: center center; | |
margin: 0 auto; | |
} | |
.words { | |
font-family: 'Pacifico', cursive; | |
font-size: 150px; | |
padding: 30px; | |
} | |
.btn-primary { | |
font-family: 'Hind', sans-serif; | |
} | |
#theQuote { | |
font-size: 20px; | |
border: 5px solid; | |
margin: 30px; | |
padding: 20px; | |
background-color: white; | |
font-family: 'Open Sans', sans-serif; | |
} | |
#tweet { | |
color: white; | |
text-decoration:none; | |
} | |
btn-primary { | |
background-color: gray; | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" /> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment