Looking for some feedback on my quote machine


Here’s a link to my random quote machine :

I feel that it’s mostly, functionally, complete. It’s not the prettiest thing in the world and i’ll endeavour to fix that. (I read somewhere that yellow is an inspiring colour but I think that all it really inspires is dry heaving.) That said it seems to me that it does what it’s supposed to.

However, I’m not very happy with the way it hides the quotation’s well (and the twitter button). It’s supposed to be hidden on documentready but you can see it sort of being swept to the side when you open it up.

I’ve also used the twitter’s own web intent for the tweeting of the quote. This seems functionally correct but is there a better way to implement this? (Especially as codepen/twitter don’t seem to play well with each other.)

I ended up creating and “hosting” my own json file on dropbox, something I was inspired to do from hearing that another user had done so. This was mainly because I just didn’t like the quotes supplied by other api’s (Chuck Norris - I do even have the beginnings of another quote generator using that api still on my codepen) and liked the hands on of making it myself.

Thanks for spending your time to take a look at my work for me and for any feedback you can give.


Hey there, that’s a cool little quote machine.

I wanted to say, you can stop the inspiration div from being visible when the page loads by adding display: none; to the .inspiration class in your css.

display: none;

also you can remove these lines of code from your js too.
`$(".hide-me").hide(function() {
    // This just hides the inspiration copy until it's needed - might be unnecessary when this text is being driven by JSON 

Hope that's what you were looking for.
1 Like

That was great thanks! I’ve actually applied that css to my “hide-me” class instead as it achieves what I was after. (I wanted the tweet button to be hidden as well.)

I had seen this on stackoverflow but there were comments that said that it would be problematic for people not running javascript in their browser so I avoided it. Thinking about it though getting something to hide would be the least of my problems if javascript wasn’t running as the JSON nor the jQuery would work either!

I see button borders when embedded, but don’t see them on codepen. Also, tweet button doesn’t work - probably because you need to open it in new window (using _blank).

I’m not sure what you mean by your first comment. I did use a set of css modules I found called Pure (http://purecss.io/) which I liked the button styling they used. Is that something I should be avoiding?