Blogs

Update 2: I posted another fix to the file I posted yesterday to correct an issue with text objects inside iFrames.

Update: I posted a fix to the file I posted yesterday to correct an issue with weird characters appearing at the end of textareas in IE.

Wow. I was so surprised today to find out how hard it is to reliably get the current text selection and caret position through JavaScript in different browsers. Ok, Firefox is easy. Internet Explorer is profoundly hard and weird. I looked at a lot of different methods including (but not limited to):

• http://www.teria.com/~koseki/memo/xbselection/
• http://www.bazon.net/mishoo/articles.epl?art_id=1292
• http://www.thescripts.com/forum/thread147441.html

.. and of course the official docs, which suck:

• http://msdn2.microsoft.com/en-us/library/ms535869(VS.85).aspx

None of these methods worked for me, for various reasons. The biggest issue is IE6/7 differences in the techniques, and also differences with how TEXTAREA’s versus INPUT fields work.

I have tested this script and it appears to be working on:

• input text fields
• textareas

on..

• IE6
• IE7
• Firefox 2
  
• Safari (PC 3)

It probably works on Opera too.
For my full script go here:

getcaretselection3.js

This has come up a couple times for me now so I thought I’d post this information for others so there is yet another place to find it.

It turns out that there are limits to the size or your querystring (what’s in your address bar). This depends on your browser:

Microsoft Internet Explorer

The maximum length of a URL in Internet Explorer is 2,083 characters, with no more than 2,048 characters in the path portion.

Firefox

After 65,536 characters, the location bar no longer displays the URL in Windows Firefox 1.5.x. However, longer URLs appear to work.

Safari

At least 80,000 characters will work.

Opera

At least 190,000 characters will work.

Apache Server

The official Apache documentation only mentions an 8,192-byte limit on an individual field in a request. However, independent tests indicate it’s closer to 4,000 Characters.

Microsoft Internet Information Server (IIS)

The default limit is 16,384 characters (yes, Microsoft’s web server accepts longer URLs than Microsoft’s web browser). This is configurable.

Perl HTTP::Daemon Server

Up to 8,000 bytes will work. Those constructing web application servers with Perl’s HTTP::Daemon module will encounter a 16,384 byte limit on the combined size of all HTTP request headers. This does not include POST-method form data, file uploads, etc., but it does include the URL. In practice this resulted in a 413 error when a URL was significantly longer than 8,000 characters.

As many of you probably know.. PNG’s (Portable Network Graphics) are graphic files that support (among other things) alpha-channel information for images (transparency). For the web it means you can overlay PNG’s over your web pages to do things like nice drop-shadows and such. For an example, check this out.

In Internet Explorer 6 we were given the CSS ‘filter’ attribute, which allowed the developer to essentially use directX to handle things like… PNG opacity! This was a fantastic addition, although kludgy. eg:

Instead of <img src=”my32bitPNG.png”>

you had to do things like:

<div style=”width: 50px; height: 50px; progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’my32bitPNG’, sizingMethod=’crop’);”></div>

The Internet Explorer team were making noises that 32-bit PNG support would be baked right into the browser in version 7. Fantastic. Actually, IE7 is backwards compatible to support the directX filter method, but also supports:

<img src=”my32bitPNG.png”>

Great. right? No.

Actually, the two methods are NOT equal.

In fact, the new, baked in method is decidedly poor, because you cannot combine it with opacity effects, wheras you still can with the old method. [gong!]

Unfrickenbelievable.

What happens when you try to apply opacity to a 32bit PNG that was referenced the simple way? Black blotches, fringed edges, and general ugliness.

IE7 32BIT PNG WITH OPACITY APPLIED (NATIVE)

IE7 32BIT PNG WITH OPACITY APPLIED (DIRECTX FILTER)

Did we just lose functionality? Insert outrage here.