Random Movie Quote Generator

Developer
Size
3,861 Kb
Views
16,192

How do I make an random movie quote generator?

Movie quote generator as part of free code camp. Click to display a random quote. Tweet current quote.. What is a random movie quote generator? How do you make a random movie quote generator? This script and codes were developed by Adam on 28 November 2022, Monday.

Random Movie Quote Generator Previews

Random Movie Quote Generator - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Random Movie Quote Generator</title> <link href="https://fonts.googleapis.com/css?family=Righteous" rel="stylesheet"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"> <link rel='stylesheet prefetch' href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="container-fluid text-center"> <header> <h1>Movie Quoter</h1> </header> <div class="row"> <div> <div id="message" class="quote"></div> </div> <div> <div id="title" class="film"></div> </div> </div> <button id="getMessage" class="btn btn-prop">Get Quote</button> <a href="https://twitter.com/share" class="btn btn-primary" id="tweet">Tweet</a> <footer>Quotes selected from AFI "Top 100 Quotes"</footer>
</div> <script src='https://code.jquery.com/jquery-2.2.4.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Random Movie Quote Generator - Script Codes CSS Codes

html { font-size: 20px;
}
@media (max-width: 600px) { html { font-size: 16px; }
}
@media (max-width: 800px) { html { font-size: 18px; }
}
body { background-color: #111111; background-image: url(http://img.wallpaperfolder.com/f/77D2AAB0B970/filming-simple-graphics-3d-fine.jpg); background-size: 1800px 600px; font-family: 'righteous', sans-serif; text-align: center;
}
header { margin: 10px -15px;
}
header h1 { color: #FF6611; font-size: 4rem; background-color: black;
}
.row > div { display: flex; justify-content: center; align-items: center;
}
.quote, .film { width: 50%; padding: 20px; background-color: white;
}
@media (max-width: 800px) { .quote, .film { width: 80%; padding: 10px; }
}
.quote { border-radius: 10px 10px 0 0; height: 120px; font-size: 1.5rem; margin: 40px 10px 0;
}
.film { height: 50px; font-size: 0.9rem; border-radius: 0 0 10px 10px; margin: -2px 0 20px; text-align: right;
}
button { background-color: #FF6611;
}
footer { color: white; margin-top: 10px;
}

Random Movie Quote Generator - Script Codes JS Codes

/*Simple Movie quoter app with tweet quote function for Free Code Camp* Using Bootstrap and Jquery*/
$(document).ready(function() { //Array with selected quotes and films var quoteArray = [{ quote: "Frankly, my dear, I don't give a damn.", film: "Gone With the Wind" }, { quote: "I'm going to make him an offer he can't refuse.", film: "The Godfather" }, { quote: "May the Force be with you.", film: "Star Wars" }, { quote: "You talking to me?", film: "Taxi Driver" }, { quote: "You're gonna need a bigger boat.", film: "Jaws" }, { quote: "There's no place like home", film: "The Wizard of Oz" }, { quote: "Show me the money!", film: "Jerry Maguire" }, { quote: "I'm walking here! I'm walking here!", film: "Midnight Cowboy" }, { quote: "Houston, we have a problem.", film: "Apollo 13" }, { quote: "Well, nobody's perfect.", film: "Some Like It Hot" }, { quote: "Say “hello” to my little friend!", film: "Scarface" }, { quote: "Bond. James Bond.", film: "Dr. No" }, { quote: "You can't handle the truth!", film: "	A Few Good Men" }, { quote: "I'll have what she's having.", film: "When Harry Met Sally" }, { quote: "I see dead people.", film: "The Sixth Sense" }, { quote: "Keep your friends close, but your enemies closer.", film: "The Godfather II" }, { quote: "Here's Johnny!", film: "The Shining" }, { quote: "Hasta la vista, baby.", film: "Terminator 2: Judgment Day" }]; //declare variables var randomMovieQuote = ""; var randomFilmName = ""; //tweet current quote and film function tweet() { window.open("https://twitter.com/intent/tweet?text= " + randomMovieQuote + " - " + randomFilmName); } /*function to obtain a random quote and display in html*/ function randomQuote() { random = Math.floor(Math.random() * quoteArray.length); randomMovieQuote = quoteArray[random].quote; randomFilmName = quoteArray[random].film; $("#message").html(randomMovieQuote); $("#title").html(randomFilmName); } //Event listeners $("#getMessage").on("click", randomQuote); $("#tweet").on("click", tweet); randomQuote();
});
Random Movie Quote Generator - Script Codes
Random Movie Quote Generator - Script Codes
Home Page Home
Developer Adam
Username rzencoder
Uploaded November 28, 2022
Rating 3
Size 3,861 Kb
Views 16,192
Do you need developer help for Random Movie Quote Generator?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Adam (rzencoder) Script Codes
Create amazing video scripts with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!