Jump to content
Search Community

Draggable Hit Test Does NOT work in IE8 (1.18.0)

TopGUN121 test
Moderator Tag

Go to solution Solved by Carl,

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Hi Everyone,


I think i found a bug in the latest version of draggable.   When i went to test my latest project in ie8 the hit test did nothing in that browser.  Worked fine in all others.    I am using the newest version you can download.   No errors where thrown up or anything like that.  I could still drag everything but once i drag the div over the hit location nothing happened.   When i switch to an older version of draggable it worked just fine. I know the release notes on 1.18 says it was fixed but it didn't work for me.   I created a codepen:  but it seems code pen doesn't work in IE8.  So i attached the export zip of this.   What should happen when you move the red div to the white one an alert should pop up, but it does not in ie8.   If i'm coding something wrong let me know!    




See the Pen epdBgP by anon (@anon) on CodePen

Link to comment
Share on other sites

Thanks. Both the local and CodePen demos are helpful.

We can fork your pen and view it in "debug" mode which is a full page view with no codepen iframes or anything (which will function in IE8).


We will look into this and get back to you when we have some info.

Link to comment
Share on other sites

Here's an excerpt from the docs:


E8 (and earlier) is not supported because hitTest() requires element.getBoundingClientRect() which is in all modern browsers.



Sorry :(


I'm curious - do you have a client that still mandates IE8 support? It seems like such a rare thing these days. I'd strongly recommend that you advise against doing a bunch of backflips for an ancient browser that Microsoft itself hasn't supported for quite some time and represents such a tiny fraction of the web audience. But then again, I know some legacy sites need to serve populations in 3rd-world countries or ancient government systems :) Warning: at some point in the next year we'll likely drop support for IE8 too (unless we get a lot of requests to the contrary). It's just too costly and impractical. 


By the way, the latest Draggable seems to work fine in IE8 (with the exception of hitTest() which we already addressed). 

  • Like 2
Link to comment
Share on other sites

After digging into the hittest part of the docs it does say the quote you gave, but i also saw this on the main page:

  • Even works in IE8! - all major browsers are supported.

So maybe update that part that yes the drag works, but not the hittest anymore.  I also know that the older versions the hitTest worked just fine in ie8, so hence why i was surprised it didn't now.  So was the way it was coded changed?   I just trying to figure out what changed.  I can use an older version  for my project.   As of this time i have to support ie8 since our projects get put into legacy systems that users only have access to ie8 to see.  BUT please drop support for IE8 since we have been trying on our end to drop ie8 support in our projects.   It would make our team so happy if we have another solid reason not to keep supporting it.   But i am curious when the hitTest code got changed to no longer work in IE8.   I just wanted to make sure it wasn't a bug or anything like that.



Link to comment
Share on other sites

  • Solution

Thanks, the Draggable page has been updated to  say:


  • All major browsers are supported including IE9+. IE8 lacks hitTest() support.

Yes, the code was changed to work better in modern browsers and there was just no practical way to maintain full feature parity with IE8. 


Sorry for the confusion. Hopefully the older versions still do what you need. 

  • Like 1
Link to comment
Share on other sites

I have a few corrections to offer:

  1. I don't think hitTest() ever worked properly in IE8. Ever since we implemented it, it used getClientBoundingRect() which doesn't work right in IE8. Maybe in your particular case it was okay with IE8's non-standard behavior. 
  2. There *was* a problem in the latest Draggable that would only affect IE8 if you passed in selector text instead of the element itself. So to solve it in your case, all you need to do is change this.hitTest("#hittest", "75%") to this.hitTest(document.getElementById("hittest"), "75%"). I'll fix the issue in the next release.

Sorry about any confusion there. 

  • Like 2
Link to comment
Share on other sites

Crazy,  I have used draggable with the hitTest in a couple projects this year and no issue in IE8.  Using the basic same code in my codepen.   


I was using this version:

VERSION: 0.11.0

DATE: 2015-01-20


No error or anything like that pop up.   My new timelines launch just fine once the div is dragged to the hit area.  I am not doing anything complex really in my projects.  You just drag the div to the correct spot and I just launch a timeline if they are correct. Thank you for the additional information about what is going on with this!   I'll make sure i keep this older version around.     

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...