Skip to content

Instantly share code, notes, and snippets.

@pilgrim011

pilgrim011/index.html

Created November 11, 2016 00:16
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save pilgrim011/17162efb04a8b71fa2e37985e66bfe5d to your computer and use it in GitHub Desktop.
Save pilgrim011/17162efb04a8b71fa2e37985e66bfe5d to your computer and use it in GitHub Desktop.
Download ZIP
randomQuotes2
Raw
index.html
<html>
<head>
<link rel="stylesheet" type="text/css"
href="https://fonts.googleapis.com/css?family=Tangerine">
</head>
<body>
<div class="container-fluid text-center">
<h1>
Random Quotes Machine
</h1>
<p>
My favourite quotes
</p>
<button class="btn btn-default" type="submit">New Quote</button>
<div class="quotes">
<span class="quote">
<h3>Ovo je citat</h3>
<h5>Ovo je autor</h5>
</span>
<a class="twitter-share-button" target="_blank"
href="https://twitter.com/share">
<button type="button" class="btn btn-primary">Tweet this!</button>
</a>
</div>
</body>
</html>
Raw
script.js
$(document).ready(function(){
$("button").on("click", function(){
$.getJSON("https://jsonp.afeld.me/?url=http://quotes.stormconsultancy.co.uk/random.json?callback=",function(a) {
$(".quote").html("<h3>" + a.quote + "</h3>" + "<h5>" + a.author + "</h5>");
});
});
});
Raw
scripts
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
Raw
style.css
body {
background-color:black;
}
h1{
color:white;
font-family:Tangerine;
font-size:50px;
}
p{
color:white;
font-family:Tangerine;
font-style:italic;
font-size:25px;
}
.quotes{
background-color:black;
width:33%;
margin-left:auto;
margin-right:auto;
border-color:white;
border-style:solid;
border-radius:5px;
margin-top:20px;
padding:20px;
height:auto;
color:white;
}
.quote{
font-size:30px;
}
.author{
font-size:20px;
font-style:italic;
}
Raw
styles
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment