Reinstate thumbnails in jQuery UI theme switcher

You might have noticed, some tools from jQuery are not fully functional recently. That could be caused by jQuery disabling hotlinks. jQuery UI theme switcher is affected. I call it a bug because jQuery team did not make necessary arrangement before enforcement of hotlink policy.

Nevertheless, how to reinstate thumbnails in jQuery UI theme switcher while waiting for jQuery team to release a hotlink compatible theme switcher? Easy, with my code – Themeswitcher Launcher.


jQuery(function($){
 $('body').prepend('<div id="msdk-themeswitcher"></div>');
 $('#msdk-themeswitcher').themeswitcher();
 var srcStart = "http://jqueryui.com/themeroller/images/";
 $('img[src^="http://jqueryui.com/themeroller/images/"]').each(
 function() {
 this.src = this.src.replace(srcStart,
 "http://static.jquery.com/ui/themeroller/images/");
 });
});

Themeswitcher Launcher just does a simple job: replacing images source in theme switcher to another source static.jquery.com, which still allow hotlinking. You can replace with your domain if you host these images.

To save your time, I packaged jQuery UI theme switcher with my Themeswitcher Launcher. Please note I changed jQuery UI theme switcher slightly because I need it for Magento sites. I put function themeswitcher() into jQuery namespace to be standard jQuery plugin, so it can be working with javascript prototype framework.

Download msdk-themeswitcher-launcher.js.tar.gz

For those who are interested in my Magento modules: jQuery UI theme switcher and my Themeswitcher Launcher are integrated into my Msdk (Magento SDK) module – it is just an advertisement.

Leave a Reply

Your email address will not be published. Required fields are marked *