Hello i am trying to get this script to work but its just not working well the getquote function gets quote and a randome color from the defined arr and then update the page according to the the data it obtaines. after calling the getquote none of the ouput works as intended
Can anyone help show me where the fault is coming from or point out the broken part ??
var colors = [
'#490A3D',
'#BD1550',
'#E97F02',
'#F8CA00',
'#8A9B0F',
'#69D2E7',
'#FA6900',
'#16a085',
'#27ae60',
'#2c3e50',
'#f39c12',
'#e74c3c',
'#9b59b6',
'#FB6964',
'#342224',
'#472E32',
'#77B1A9',
'#73A857'
];
var quotes = [
["You only live once, but if you do it right, once is enough.", "Mae West"]
]
var currentQuote = "";
var currentAuthor = "";
var randomquote = "";
var randomcolor = "";
function getQuote() {
randomquote = Math.floor(Math.random() * quotes.length);
randomcolor = Math.floor(Math.random() * colors.length);
currentQuote = quotes[randomquote][0];
currentAuthor = quotes[randomquote][1];
$(document).ready(function() {
$('html body').animate({
backgroundColor: colors[randomcolor],
color: colors[randomcolor]
}, 500);
$('#newquote, .social-icons .fa-twitter').animate({
backgroundColor: colors[randomcolor]
}, 500);
$('blockquote footer').animate({
color: colors[randomcolor]
}, 500);
$('blockquote').animate({
borderLeftColor: colors[randomcolor]
}, 500);
$('#quotetext').animate({
opacity: 0
}, 500, function() {
$(this).animate({
opacity: 1
}, 500);
$(this).text(currentQuote);
});
$('#quotesource').animate({
opacity: 0
}, 500, function() {
$(this).animate({
opacity: 1
}, 500);
$(this).text(currentAuthor);
});
});
}
getQuote();
$(document).ready(function() {
$('#newquote').on('click', getQuote());
});body {background:#16a085;}
.btn-primary {
width: 100px;
height: 40px;
background:#490A3D;
}<body>
<h2 id="quotetext"></h2>
<footer id="quotesource"></footer>
<button class="btn btn-primary" id="newquote">New Quote</button>
</body>$(document).ready(function() {
$('#newquote').on('click', getQuote);
});
You need to pass callback as a variable. In your example it is being invoked and the result of the function (which is nothing) is passed to event listener.