jquery

Mobile support for chosen

Chosen is a jQuery plugin which makes select boxes more user-friendly. Currently, support is disabled on mobile devices for various reasons. Enabling the support requires a hack in the source code for now in the AbstractChosen.browser_is_supported function to return true when the userAgent finds Android or iPhone/iPad. You can download the patched version at the bottom (or detail) of the article. The current version is 1.1.0

Chosen will now be enabled on mobile, but touching the element will not work nicely since the plugin doesn't listen for the touchstart event to trigger the functionality. Opening the select box requires touching the element for at least a couple of seconds, which isn't really user-friendly. Luckily, there's an easy way to get around this by writing a couple lines of javascript:

    // Chosen touch support.
    if ($('.chosen-container').length > 0) {
      $('.chosen-container').on('touchstart', function(e){
        e.stopPropagation(); e.preventDefault();
        // Trigger the mousedown event.
        $(this).trigger('mousedown');
      });
    }

That's it, fully functional chosen support on mobile devices!

Topics 

jquery, mobile phone

Tag your website with Banksy

I haven't come far in my search for Banksy and I didn't get any more clues after seeing Exit through the gift shop this week where to find him - actually, not even trying to find him, however, if you, yes you, Banksy, ever read this, just send me a mail, will you? Even a single dot will do.

Anyway, after doing art on the street, galleries and now the movie, it's time to hit the internet. So, a tiny brainstorm and a few javascript lines later, I came up with this button on which you can click underneath or drag in your bookmarks browser to tag any website with a random Banksy piece. Actually, 1 is not from him, but if you, yes you, Banksy, ever read this, just send me more and better stuff to tag sites with, will you ? Or someone who's better than me creating non pixelized pictures to work on sites with dark backgrounds ...

Banksy tag!

You can also drag that link to your bookmarks bar or a tab and start tagging other sites.

On internet explorer ? Right click and choose "Add to favorites" (yes, it's safe).

Topics 

jquery, banksy, tag

Multiple select without holding ctrl button

I've put up a test page where you'll find 2 multiple select boxes. You should be able to select multiple options without holding that damn CTRL button. The jquery built into Drupal and my small code snippet takes care of this for you. Please test it out and leave a comment when:

  1. you experience problems. Important, I need to know which browser/os you're on, otherwise, the comment is useless.
  2. you have suggestions to optimize the code.

Please test, so I can post this on the Drupal/Jquery forums. Open source can benefit from all our help!

Drupal multiple select jquery test

Note: this code is old, but left here for legacy reasons. The example doesn't work anymore!

You should see 2 multiple select boxes. If your javascript is enabled, you should be able to select multiple options without holding the CTRL button. The jquery remembers those for you. Toggle works fine. If you think you have improvements or experience problems with your browser/os, leave a comment at the bottom. Firefox 2 and galeon on Linux are tested and work fine.

Subscribe to RSS - jquery

You are here