Author Archives: torontographic

About torontographic

looking for work since 2009

How to sync MP3 music and lyrics to css3 animations.

Got bored so decided to play around with 2D css3 animation. The goal was to sync lyrics and css3 animation to an mp3 file. Take note: the syncing requires HTML5’s Audio currentTime (audio.currentTime). It will only work in the latest … Continue reading

Posted in Sync CCs Animation | Tagged , , , , | Leave a comment

jQuery Fixed Table left Column and Headers with drag scrolling

This example shows a Table with a Fix left column and header using jQuery. Scrolling on second column horizontally while be able to scroll all columns vertically. Auto scrolling while dragging. Don’t use IE (explained later). Revisiting my jQuery Timeline … Continue reading

Posted in jQuery Fixed Table Column Drag Scrolling | Tagged , , , , , , , , | 1 Comment

Editor for Closed Captions in Storyline

Closed Captions Editor for Storyline is a HTML5 editor that I built after having to constantly open and publish storyline projects requiring CC in one or two languages. Why? : Most projects I work on have 50 slides or more. … Continue reading

Posted in Storyline | Tagged , , | Leave a comment

Adding an HTML menu to Articulate Storyline

Run Demo: This deals with adding a HTML CSS3 Jquery menu to a Articulate Storyline eLearning project (Flash version Storyline 1) The example has only 5 pages only. (the other 41 pages would also work if you added them) Click image to … Continue reading

Posted in Storyline | Tagged , | 1 Comment

Jquery Timeline range control (like Flash, Storyline, Recording Software)

myRangeSlider Jquery Plugin A horizontally or vertically Timeline Range Slider. These type of range sliders can be found in timeline animation programs like Flash and Storyline. Range Slider are also used extensively in audio recording programs to display audio wave … Continue reading

Posted in html5, jQuery mouseSwipe | Tagged , , , , , , | Leave a comment

So you want Parallax Scrolling on iOS iPad, iPhone and iPod

parallaxSwipe for all touch and web browsers including iOS touch screens. This week I looked at a jQuery parallax plugin by Jonathan Nicol at f6design. So, I grapped it and then spent hours designing a page to use for an iPad project for … Continue reading

Posted in jQuery mouseSwipe | Tagged , , , , | 2 Comments

jQuery selectSwipe Select option Scroller

Here’s an ipad/android style menu option select scroller that should work on all browsers and touch pads. (except ie6 and ie7 due to css incompatibility! e.g. position: absolute, fixed and pointer-events: none; for overlaying glass image) It might not look to impressive at … Continue reading

Posted in jQuery mouseSwipe | Tagged , , , , , , , | 1 Comment

HTML5 Canvas example

Here a re-post of my fancy ball reflection code using canvas on enabled HTML5 browsers. Sin, Cos and Atan at it’s finest (and scariest). This thing will bounce off anything. Everything can be viewed in the page source of Demo … Continue reading

Posted in html5 | Tagged , , , | Leave a comment

mouseSwipe Jquery Touch Content Slider Plugin

mouseSwipe is a jQuery content slider with tablet touch or mouse drag navigation. It weights in at under 4kb in size. Uploaded new zip with source Sept. 7th 2016. Added miniSwipe for modern browser (no panels or arrows) 80 lines of code. Sorry, … Continue reading

Posted in jQuery mouseSwipe | Tagged , , , , , , | 6 Comments