Strange Fancybox/Ajax behavior – HierarchyRequestError

| October 29, 2012 | Reply

A few days ago I accidentally discovered a weird behavior in fancybox. It’s present both in the old 1.xx and in the new 2.xx versions, up to 2.12.
If you try to load images with fancybox, and the files in the file system don’t have extensions, an exception gets thrown by jQuery. The exception is:

HierarchyRequestError: Node cannot be inserted at the specified point in the hierarchy

Fancybox 2.xx just swallows the exception, while fancybox 1.xx does not catch it, so I used version 1.34 to inspect what’s going on. As far as I understand, by default, fancybox uses jQuery.ajax() to fetch the new images. Apparently, if the files lack extensions (e.g. “/pictures/image1”, “/pictures/image2”), jQuery’s ajax method somehow doesn’t recognize them properly. Thus, jQuery doesn’t really know what to do with them and seems to be unable to insert them in the DOM. Then the exception gets thrown.
The current solution is to just NOT use files without extensions if you want fetching by ajax. Loading using the standard javascript Image objects doesn’t cause any problem whatsoever.

Tags: , , , ,

Category: Development, Troubleshooting

About the Author ()

Leave a Reply