Simple flashcards using JQuery

A Tech article with View Comments posted 10 December 2007.
Tags: ,

I wanted to create some flashcards for my Jesus and the Gospels class, where the final exam involves being given a large number of fill-in-the-blank questions. I also wanted to try out JQuery, a lightweight Javascript toolkit that has fascinated me for a while. The result is quite impressive for very little work.

To add items to the flashcards, you mark up text that looks like this:

How now brown cow?

So that it looks like this:

<p>How now <span class=”words”>brown</span> cow?</p>

I inlined the JQuery 1.2.1 library, wrote a tiny bit of glue to make things look good, and the result can be downloaded here: BI190 Flashcards using JQuery.

You might also enjoy:

  1. Simple Table Of Contents in JQuery
  2. Pauker for flashcards
  3. WordPress jQuery Table of Contents plugin
  4. Extracting the next 7 days from phpiCalendar to simple HTML
  5. Kahlua and Caffeine

  • Wow, somehow I didn't see this comment until now. Sorry! The trouble with doing a memory test is the vast number of ways that you can type a valid answer. The company I work for, Ideaworks, runs an essay grading service called SAGrader, which performs this feat, and it's quite an involved process. Definitely possible, and SAGrader does a great job of extracting student answers from unstructured text, but let's just say that it's more complicated than I care to implement in Javascript.
  • hey, i like the flashcard idea. any way of being able to use it like a memory test, ie. so i can actually type in the text before clicking to see the answer?

    also, i like your work on vixta.org. have been trying to put ubuntu on my laptop which has win 2000 on it, as win 2000 seems really slow on an old laptop. with ubuntu it seems to fly.

    i'd like to try vixta, but my laptop only has a cd-rom and not dvd-rom :(

    i could prob. create a bootable usb drive, but it seems like a lot of work, and i'm not sooo technically minded.

    blessings, aaron
blog comments powered by Disqus