jQuery Timetable Mobile
One of the key bits of information we need to display in the education sector are timetables. This could be for learners, tutors or rooms. I wrote my first HTML/Javascript Timetabling interface back in 2002 for ebs (Tribal’s further education product) which was a fairly painful mashup of HTML tables and Netscape/IE6 Javascript hacking. It worked but the code wasn’t pretty. The time had come to bring the HTML timetable up-to-date and once again, up steps jQuery to make life much, much easier.
Once again I’m using the Twitter Bootstrap component library to provide a nice responsive site so it will display nicely on phone and tablet devices, also catering for touch interfaces very nicely when you can’t rely on hover over text.
jQuery Timetable
To see it out for yourself and check out the code then have a look it on our demo site. I’ve tested it on a number of desktop browsers, iPhone/iPad, Android and Windows Phone devices successfully.
As you can see from the source the lessons/events themselves are just an <ul> (unordered list) so assistive technologies should be more than happy.
It can also print out ok if the browser is sized right but a few extra css tweaks will be needed to get that fully dialled.
