Recreating swipe to reveal in HTML, CSS and JS

Wed, 20 Oct 2010 12:19:35 +0000

One of the things I really like about the interface in Tweetie / Twitter for iPhone is being able to swipe a tweet to reveal actions beneath it. This is my attempt to recreate it using HTML, CSS3 and Javascript. The main swiping action seems to work nicely, but to complete it, I'd like to add a bit more bounciness, a sound effect on swipe (using ?) and have better handling of non-swipe actions.

Only load jQuery if not already present

Mon, 21 Jun 2010 14:01:59 +0000

Very useful method of ensuring jQuery is loaded before running the code that needs it - from How to build a web widget (using jQuery) - Alex Marandon

[js] /******** Load jQuery if not present *********/ if (typeof jQuery === "undefined" || jQuery.fn.jquery !== '1.4.2') { var script_tag = document.createElement('script'); script_tag.setAttribute("type","text/javascript"); script_tag.setAttribute("src", "http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js") script_tag.onload = main; // Run main() once jQuery has loaded script_tag.onreadystatechange = function () { // Same thing but for IE if (this.readyState == 'complete' || this.readyState == 'loaded') main(); } document.getElementsByTagName("head")[0].appendChild(script_tag); } else { main(); } [/js]

Javascript on Ricky Moorhouse

Recreating swipe to reveal in HTML, CSS and JS

Only load jQuery if not already present