add “readonly” to < input > (jQuery)

Nice little trick without having to set disabled and the input not getting submitted or whatever:

"$('#inputId').attr('readonly', true);

of course to remove use:

"$('#inputId').removeAttr('readonly');

This function doesn’t work on checkboxes as it prevents you from editing a field’s value, but with a checkbox you’re actually editing the field’s state (on || off)

Another bug in MSIE 7, this one concerning z-index

I’ve just spend two hours figuring out why my css styled list menu works fine in Chrome, Safari etc, but not in Microsoft Internet Explorer 7. I run into this kind of crap on many occasions, but this one was a real pain in the but. Besides everything, but useful to mention.. please drop IE7 and while your at it drop your Windows OS as well!

Anyways. After a lot of reading, reloading, etc. I finally ran into comment #26 on http://drupal.org/node/84608, which stated the following code which worked out great to me:

if($.browser.msie&&parseInt($.browser.version)<=7){
  $(document).ready(function() {
    var zIndexNumber = 10000;
    $('div').each(function() {
      $(this).css('zIndex', zIndexNumber);
      zIndexNumber -= 10;
    });
  });
}

This jQuery snippet puts all divs on your page into correct hierarchy for MSIE7 after loading the page (if implemented correct) since MSIE7 tends to make a mess out of rendering the z-indexes. In my case I had the menu finally on the highest z-index possible (I walked through all the nodes of my document) and the menu still appeared behind some form inputs. I tried all the positioning hacks you read about on stackoverflow.com f.i. but this didn't work for me. MSIE7 seems to restart the z-index on every positioned div it runs into.

Not saying you should use this, since this also messes up any z-index you have put onto a div through regular css, but it worked for me.

JQuery 1.3.2. & Lightbox-2 conflict

stimuliToday I found out why the Lightbox-2 plugin didn’t work on the straathofmanegebodems website. I had placed a JQuery script on the faq page to have a better overview of the questions in the faq. I had used jquery-1.3.2.min.js which interfered with the JQuery 1.3.2 javascript libs used by Lightbox-2 (packaged with the plugin).

I found this out by placing the wp_head tag last in the head, which made Lightbox-2 work and the faq to fail, while when I placed it above my custom faq javascript Lightbox-2 failed but my JQuery changes worked. I guess no wonder since the one or the other javascript lib will overwrite functions in the other.

Since I have a lot on my hands right now I fixed it by only including my script when browsing the faq, in this case the Lightbox plugin won’t work since I placed the script after the wp_head() statement.