How to build a web widget using jQuery

I created some web widgets for the London’s Design Museum and learned a few useful things in the process. Although all the necessary information can be found on the web, I couldn’t find a really comprehensive guide about doing this with jQuery so I decided to write this one. I’ll cover only techniques which are specific to web widgets so you should already be familiar with JavaScript, jQuery and web development if you want to follow easily.

The interesting points will be:

• ensure the widget’s code doesn’t accidentally mess up with the rest of the page,


• dynamically load external CSS and JavaScript files,


• bypass browsers’ single-origin policy using JSONP.