Jump to content
Search Community

Problem with ie8 and Draggable hitTest

mattwhituk test
Moderator Tag

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, I have been moving old Flash projects over to using HTML and JS. My projects use a lot of drag and drop interaction so GSAP is fantastic for me.

 

I am having difficulty getting it to work with IE8 (works perfectly with modern browsers). I have narrowed down the problem to be with the hitTest function that causes the error: Object doesn't support this property or method

 

Is hitTest something that doesn't work with ie8 or should I be looking elsewhere for errors? 

 

Thanks,

Matt

Link to comment
Share on other sites

Hello mattwhituk, and welcome to the GreenSock Forums!

 

So your getting this error:  Object doesn't support this property or method

 

IE8 is notorious for being buggy

  • What does your code look like?
  • What property or method are you using?
  • Is this standalone IE8, meaning not a Document Mode in IE? (Document modes will not give an accurate rendering)
  • What OS are you seeing this on?

This can be a number of things.. but it will be hard to know whats going on without some code for context.

 

To better help you can you please setup a codepen example demo, so we can see code that we can edit and test?

 

Here is a nice video tut by GreenSock on How to create a codepen example demo.

 

Do keep in mind that IE8 will not work in codepen Edit View mode, so you will have to view it in FULL VIEW mode.

 

This way by having the codepen example demo, we can better help you by seeing what you see.

 

Thanks!

  • Like 1
Link to comment
Share on other sites

Hi Jonathan,
 
Thanks for getting back to me. Unfortunately, the code that I am using is generated using Lectora. I don't know if you are familiar with this but it makes an incredible mess of the html which I am trying to work around.
 
For this reason, it is hard to give you a working example. I will try to simplify a version and stick it into codepen. In the meantime.....
 
The error is being fired when it gets to the hitTest function in the following piece of JS:
 

Draggable.create(droppables, {
type:"x,y", 
edgeResistance:0.85, 
bounds:$container,
dragClickables:true,
onPress:function(e) {closeOpenFeedback()},
onDrag:function(e) { $(this).addClass("draggingShadow");},
onDragEnd:function(e) {


$(this).removeClass("draggingShadow");
var i = targets.length;


while (--i > -1) {

if (this.hitTest(targets[i], overlapThreshold)) {
console.log(targets[i]);
onDrop(this.target, targets[i]);
}
}
decideIfHit(this);
},


});

I am running on xp mode using a standard ie8 installation, it should be realistic as it is a virtual machine.

 

As I mentioned, it works perfectly on modern browsers which is making it tricky to troubleshoot. I will try to strip back the HTML and add it to codepen.

 

Thank you

Link to comment
Share on other sites

Hi Carl,

 

After a quick test I am delighted to report that it seems to be working. I will get a more thorough test carried out but, so far, it looks great.

 

The demands of people wanting interactive development to work exactly the same on ie8 as it does on tablets are proving tough to meet (surprised?!) but you guys have come up with a life saving tool.

 

Thank you so much.

  • Like 2
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...