I am having an issue with Internet Explorer 10 not properly registering the location of the mouse on the <canvas> element if it is not up against the top of the page. Open up IE10 and look at the links below.
The problem:
Click on this link and try dragging the nodes of the graph around:
http://ffi-server.no-ip.biz:257/test/good.html
Now, try the same thing on this page: http://ffi-server.no-ip.biz:257/test/bad.html
Interestingly, IE9 does not have this issue, and adding a <meta> tag to tell IE10 to render the page as IE9 does not solve this issue.
Possible solution?
I think I have found the problematic line of code, I just can't figure out how to correct it. Look at line 3044 in: http://pastebin.com/82GJBiEB
I just don't know how to correct it. I believe that IE10 is reporting a different e.pageY value than browsers which are working correctly. You can verify that by clicking on different areas of the canvas on this page: http://ffi-server.no-ip.biz:257/test/alert.html and see the reported values in IE10 and, say. Chrome.
Could anyone suggest a way to correct this issue?
Thank you for your time!
Try e.layerX, and e.layerY. I had a similar issue, and this fixed it.
Related
I'm working on a project for my school where the courses, teachers and clasroomnumbers are appearing for the signage TV's.
The start of the project was made by the company who make's our software. The only thing I can do now is change some things with javascript. These changes are working fine in Chrome and Firefox. However I need it to work in Internet Explorer.
You could go to this link to see what happens:
https://www.miras.be/lokaal_bezetting_lijst/57/2019-09-26/08:00/22:00/
When you open in Chome or Firefox it works perfectly
When you open in IE, you see that the hours are not well displayed.
--> Strange manual solutions: When I refresh the page or do something that resizes the window, it does work.
Bad view:
Good view:
Does anyone know a javascript/jquery solution for this?
Thanks in advance!
Laurent
If you want the table column width always fixed you can use
MIN-WIDTH and MAX_WIDTH on the same column. If you will you the both property with width than table column will always same.
After a long search I've found the solution. As I've mentioned, it becomes ok when I resize the window. With this event at the end of my script everything was fixed. Thanks for the answers and help!
$(window).trigger('resize')
Got a problem with an app wrote in AngularJS. Seems that in Internet Explorer I get ghosting of elements or elements not rendering correctly however in Firefox and Chrome it works perfectly. I updated AngularJS to 1.5.9 to see if it fixed any issues but however it doesn't. I've included an image of the issue below. If I resize the IE window then it redraws the elements and looks like the second picture. As mentioned this is only present in IE. Has anyone come across this before and knows how to fix it?
The issue
What it should look like and does after resizing the window
I have been researching all over the internet about this, and unfortunately cannot find out why this is happening. It seems to only be happening in internet explorer 9, on certain computers.
The entire page looks like a mess only in IE 9 (some computers):
The URL of the website is Here
Can anyone tell me why this is happening in IE9?
(NOTE: Compatibility view cleans it, but then the Js/jQuery doesn't work right).
For some reason, IE thought that the site was in my intranet, and rendered it in Compatibility Mode (there's a setting in IE to automatically render intranet sites in CM).
When I unchecked the box to "automatically detect intranet network", the site rendered correctly.
So your real question is how does IE determine the intranet network, and how can you force your page to NOT render in Compatibility Mode... something like this.
I noticed that you have blank space above your doctype. IE hates this. The doctype needs to be the very first thing in the file.
You also have over 2300 HTML validation errors that should be investigated and rectified. Again, IE is very sensitive to invalid HTML.
Going on a whim here, but I think it's the usage of inline-block. I don't have IE9 installed to a point where I can use it's developer console to further inspect, but IE is known to be very bad about displaying inline-block elements.
In Google Chrome's console, I am able to replicate the same appearance using float:left as opposed to display:inline-block, so that should solve that piece of the issue.
Edit: The only syntax issue I see with the HTML is the placement of the </head> tag, which is not adjacent to the <body> tag.
Edit 2: As far as the outlining issue goes, try using this answer to another question.
Edited yet again to fix the display of the tags.
http://jsfiddle.net/4t6j5/2/ (this seems to be working normally)
http://www.periferi.nu/#filter=.utstallningar (this does not)
Se the jsFiddle where I have tried to reproduce the error using the parts that are erroneous.
So the problem is that in IE8 and down the read more element starts jumping a whole lot instead of simply sliding in from below when the mouse is over the image. Works perfect in most modern browsers but in IE8 and down it starts jumping (especially when hovering the p elements, for some reason).
It appears that when the code from that part is isolated it works.
Why does it behave differently in IE? Any help is appreciated!
Ok after endless hours I have captured the bug in my css file. Strange case but thanks WTK for the direction. Turns out:
html {overflow-y:scroll;}
Was the main problem for some for me unknown reason.
If someone sits on further information as of why this happens in IE please share.
http://jsfiddle.net/4t6j5/3/ (Bug hunting fiddle)
For a site i made, http://crystalmurray.com, i have a simple little script to smooth scroll to local anchors and push the anchor to the history like it never happened. Recently my chrome updated to 12.0.742.100 and this stopped working, however, it worked fine in safari and firefox.
The obvious workaround for it is to add content to each empty anchor tag and hide it, whether manually or programmatically.
Heres an example and tester for it http://jsfiddle.net/arzynik/zfmgt/
Both empty a and empty span tags fail to position correctly.
Any other suggestions? Id rather keep editing to a minimum when updating other sites.
Your test seems to work in Chrome 14.0.794.0 (canary). The problem is probably already solved in a future version. You can wait Or file a bug report.
I encountered this same issue recently. My workaround for Chrome 12 was to set position: relative for any empty anchor tags I had. The following should fix you up:
a:empty {
position:relative;
}