JavaScript Random Quote Generator

A friend sent me an e-mail yesterday asking if I knew of a simple random quote generator that she could embed on her web page. So I’ve written one, and I’m making it available here on the off chance that anybody else wants it too. It’s implemented in JavaScript, and works simply by including a seperate .js file within the document. The ZIP file contains both the .js file (which will need to be edited in a plain text editor such as Notepad, to insert your own quotes) and a .html file, which provides an example of it’s usage. Unzip both to a folder and double-click on the HTML file to see it in action.

Download QuoteGen (ZIP file, 1.07KB).

9 replies to JavaScript Random Quote Generator

  1. Areet Dan, sir.

    We have a similar thing I once wrote for KTAB, for a book of quotes JTA made. It’s like your, but coded in a messy, "I-never-learnt-JavaScript-more-kind-of-plagiarised-other-people’s-code" kind of a way. Here, if you fancy a smug, CompSci giggle. (It’s meant to load in a small, javascripty-made window, hence the minimalist layout.)

    Is there any easy way to make it write the text without having to reload the page every time? I’m pretty sure I’ve seen some website which downloaded all the content in one go and then went from page to page by JavaScript (!), so presumably it’s possible…

  2. Yup, Statto, just move all the JavaScript out into an external file and reference it, as demonstrated in my example. Or, better yet, ditch the JavaScript (it’s less-than-ideal for this kind of purpose: JavaScript is for things that can only be meaningfully done client-side) and instead use a PHP or Perl script, or some similar server-side logic. I can help with an example of this if you wish.

    Nice to meet you, Statto. All I’d heard about you so far was from JTA

  3. I was reluctant to use PHP (though in my example it would actually be an improvement, this is true) because I wanted a quote generator which wouldn’t require the whole page to be reloaded every time you wanted a new quote. (my rural home still has no broadband, and therefore have extreme loading-time-paranoia)

    On a mildly-related note: you may have pressed “view source” on KTAB and discovered it’s all tables (yuck). I learnt HTML at some unspecified point, and I think the website from which I learnt it taught me that frames and tables were lovely. I’m currently grappling with the lovely-but-totally-counter-intuitive-for-a-tables-boy CSS2. Can you help me on either:

    1.) Can you tell something to either go to the bottom of the browser window or, if there’s more content than window height, to go to the bottom of the content?
    a) On this page the copyright notice currently sits just underneath the end of the content
    b) Whereas on this page,there’s lots of content, it goes to the bottom
    – but it’s bad, coz I want it to be at the bottom of the browser window in scenario a)

    2.) Is there any way to make a div a percentage of a width other than that of the window wide? Ie 33% of the width that remains after putting in a fixed-width menu bar? This is as far as I got. The two pastel columns on the right, with “story goes here” and “right-hand content” in them, need to be 67% and 33% of the width right of the 128-pixel menu bar. Like KTAB News at the moment, but flexible.

    Pleased to “meet” you, too! I might see you in Aber, should I visit JTA this year… Incidentally, didn’t you graduate? And if so, what are you doing still in Aber?!

  4. Sorry your post didn’t appear on my blog for so long, Statto – you posted using invalid HTML (you didn’t close your ‘abbr’ tag) and so my blog-spam filter held you in a queue until I had a chance to examine it for myself!

    Not sure what to suggest about your CSS issues. Drop me an e-mail (ask JTA for my e-addy, if you don’t have it) or meet me in Aber, and I’ll try to help you.

    Why’m I still in Aber? ‘cos I love it here!

  5. Thanks! Very useful. It’s amazing this code is from 2004 and still more elegant and manageable than most the other javascript quote generators around.

Leave a Reply

Your email address will not be published. Required fields are marked *