Random Quotes

In this example below you will see how to do a Random Quotes with some HTML / CSS and Javascript

Thumbnail
This awesome code was written by erkand-imeri, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright erkand-imeri ©
  • HTML
  • CSS
  • JavaScript
    <head></head>
<body>
<div  class="container">
 <h1>Random  Quotes Rewritten</h1><br />
  
  <p>These are some of my favorite quotes I had collected during medical<br /> school I recently rediscovered via the wayback machine. I hope you<br />
  enjoy them!</p>

<button class="btn btn-default btn-lg"  id="newQuote">New Quote</button>
  <br /><br />
  <div id="quoteshow">
    <p id="quotep"></p>
    <p  id="authorp"></p>
  </div>
  
</div>
  
</body>


/*Downloaded from https://www.codeseek.co/erkand-imeri/random-quotes-rOzLKJ */
    body
{
  text-align: center;
  margin:  0px auto;

}

h1
{
  font-family: "Oswald",Ariel;
  font-weight: bold;
  font-style: italic;
   text-shadow: 1px 1px black;
}
#quoteshow
{
  width: 500px;
  height: 200px;
  background-color: #FCFCFC;
  border-radius: 25px;
  margin:  auto;
   box-shadow: 10px 10px 5px #888888;
}

#quotep
{
  padding:  60px  10px 0px 10px;
  font-size: 20px;
  font-style: italic;
  font-family:  "Courier New", Courier, monospace;
}
#authorp
{
  font-weight:  bold;
  
}


/*Downloaded from https://www.codeseek.co/erkand-imeri/random-quotes-rOzLKJ */
    (function(){

  function randomquote()
  {
   var dataquote=
   ["The best way to find yourself is to lose yourself in the service of others.&Mahatma Gandhi","A problem is a chance for you to do yourbest.&Duke Ellington",
 "Do right. Do your best. Treat others as you want to be treated.&Lou Holtz",
    "I am as bad as the worst, but, thank God, I am as good as the best.&Walt Whitman",
 "The best way to find out if you can trust somebody is to trust them.&Ernest Hemingway",
"Knowing your own darkness is the best method for dealing with the darknesses of other people.&Carl Jung","The best road to progress is freedom's road.&John F. Kennedy",
    "He who knows best knows how little he knows.&Thomas Jefferson",
    "I do the very best I know how - the very best I can; and I mean to keep on doing so until the end.&Abraham Lincoln",
    "The best ideas come as jokes. Make your thinking as funny as possible.&David Ogilvy",
    "I have the simplest tastes. I am always satisfied with the best.&Oscar Wilde","The worst thing that happens to you may be the best thing for you if you don't let it get the best of you.&Will Rogers","The best cure for the body is a quiet mind.&Napoleon Bonaparte","The best doctors in the world are Doctor Diet, Doctor Quiet, and Doctor Merryman.&Jonathan Swift","My best friend is the one who brings out the best in me.&Henry Ford"]; 
    
    
var ranQuote=dataquote[Math.floor(Math.random()*dataquote.length)];
    
    var QuoteAuthor=ranQuote.split("&");
    
    document.getElementById("quotep").innerHTML=QuoteAuthor[0];
    
 document.getElementById("authorp").innerHTML=QuoteAuthor[1];   
    
    
    }
  
  
  document.getElementById("newQuote").addEventListener("click",randomquote);
  
  
  



})();

Comments