JS library to simulate Internet Explorer? - javascript

There are some JS library to simulate the IE in Webkit? For instance: IE8 doesn't support border-radius currently (maybe on IE10). So I run a JS library that check if I'm using the border-radius then remove it to make similar to IE vision.
It's a crazy idea, I know, but work on IE is too slow, and if I can simulate it on Webkit, will be great! I need do it to an own project too.
Note: I know that exists a Chrome extension to make a IE tab, but the proposal is different: I need run on Webkit, but eliminating features not supported on IE.
Edit1: I'm working on a Webkit based IDE to developer HTML templates. Basically I need a button that emulate the IE view version without need a IE installed too (Mac, Linux for instance). Will be interesting have a Mozilla emulator too, for instance. Basically I will generate a CSS file to each browser too. For instance: -webkit properties not will be included to MSIE CSS. filter not will be included in Webkit CSS (but can be emulated).
So, I'll make a copy of current HTML page before apply a JS method that will edit or delete the unsupported content, make it similar to IE. If IE8 not support border-radius, it'll be removed and I'll see basically an IE version of page. If Mozilla not support -webkit-box-sizing it will be renamed to -moz-box-sizing if disponible.

I know of no script, and frankly I don't expect to see one any time soon as the task of re-creating the topography of IE's support for CSS in various versions of the browser would be a massive undertaking. It would further complicate things if the undocumented hacks like _height were supported too.
Frankly, the best way to test your site in IE8 is to use IE8+. In versions IE8 and up Microsoft introduced Browser Emulation, permitting you to fallback and emulate any number of IE versions all from a single browser - I use this daily, and it's a fantastic feature.
Within IE, open up the Developer Tools by pressing F12 and from there you can change the Browser Mode to IE8. No refresh will be necessary as the browser will handle that on its own. Using this method you can quickly test versions 7 through 10 (assuming you're testing from IE10) with the click of a button.
Disabling CSS3
If all you would like to do is disable CSS3 features, you can use the Strip Tease bookmarklet. It's not a fully-developed solution, so keep in mind that it won't handle things like advanced selectors, etc.

Related

What is the browser support for element.removeAttribute?

The summary/details HTML5 element has terrible browser support. Therefore I built a non-jQuery fallback to make it work in non-supported browsers (IE and Edge). This fallback uses element.removeAttribute, but I am in doubt about the browser support of this command. I cannot find a definitive answer online. I have tried caniuse.com and MDN web docs, but they have no clear answers.
I know it works in my (updated) version of Firefox. Anyone has more info?
This method does not work consistently across browsers. It is BROKEN on MS Edge at least, and its brokenness is not mentioned by MDN, W3schools or caniuse at time of writing.
Basically, the method will fail when removing boolean attributes such as selected or hidden. The following will fail on Edge:
someDiv.removeAttribute("hidden");
Workaround is to set the attribute to "false" immediately before removing it.
someDiv.setAttribute("hidden", "false"); // "thanks" for the nonsense, MS
someDiv.removeAttribute("hidden");
This is not how boolean attributes are supposed to work, but that's how Edge requires it. Given that Edge is about to be dropped by Microsoft in favour of a Chromium-based alternative, we can expect this bug to remain unfixed, and the workaround to clutter our code for years.

How to Draw lines using wz_jsgraphics.js library in IE 7/8/9

I am using wz_jsgraphics.js library to draw lines. It is working with all browser other than IE 7/8/9. Now I want to run it on any IE7/8/9 browser. Please guide me to resolve this problem.
Walter Zorn's wz_jsgraphics.js works fine in IE7, IE8, and IE9 when I use these browsers on four different computers.
Internet Explorer has quite many options. Maybe one of them needs to be changed on your computer. For instance, if you are running jsgraphics offline from an html document on a file, the advanced IE option Allow Active Content To Run From A File (or whatever it is called) must, of course, be checked.

Does IE9 have browser mode down to IE7 and does this mean different version of Javascript

I'm having some trouble setting up virtual machines for testing IE versions (I use a mac) and have noticed on IE8 it has a browser switching mode.
Does this mode do a full switch for CSS and Javascript, I need testing to be 100% reliable.
Also does IE9 have a similar feature going down to IE7?
It's not going to be 100% reliable, I can tell you that right now. The only way to really test on IE7 is to test on IE7. For most layout checks, using the newer browser in emulation mode will be fine, but there are definitely bugs and oddities in the actual older browsers that the newer browsers don't mimic faithfully.
When you change The browser mode from the IE developer tools, IE renders the site according with your selection.
IE 9 also has this option, and if say you pick IE7, you'll get pretty much the same expercience you would get in that browser (from a layout and functionality point of view), but it's not completely reliable, some Javascript quirks are not the same (I can't remember any specific ones)
If you really need to test in IE7, get IE7 :D
More info here!
Press F12, and in the developer tools toolbar change browser mode to IE7 and Document Mode: IE7 (if you change the browser mode, then doc mode automatically changes also).
As for whether you get a different Javascript API? I don't know.
I agree with #Pointy, though. Realistically you actually need to run IE7. A VM is often a good way to do this if you don't want to muck about getting the different versions running side-by-side.

Raphaeljs library and SmartPhones

I used the worderfull javascript library called raphaeljs on my website to draw maps, animations and animated functionalities. I have noticed that the script using this library work perfectly with iPhone but not with Android.
Can someone confirm this (just going on the demo page of raphaeljs will tell you if it works of not) and if it doesn't, does someone has any idea why, and what could be tested.
Thanks
The default Android browser did not support SVG until they recently re-introduced it with Android 2.3. One workaround is to use Opera Mobile (free from the Android Market) which will work whatever the Android version.
EDIT: My mistake, it's Android 3.0 (Honeycomb) that added SVG support in the default browser.
2ND EDIT: Better add a disclaimer that I work for Opera. There may be other non-default browsers that support SVG (but I haven't tried them).
Actually SVG is supported by Android since 2.0 I think (with WebKit, default browser), it's just not enabled by default : http://jindroid.com/2010/02/15/svg-support-on-android-webkit/
There's a patch you can apply (quite hard to do though) to enable it but I would advice you to download Opera or Mozilla Firefox for Android (via Market), which also supports svg quite well (I tested FF4 with Raphael JS).
Regards

I made some voting buttons (think reddit/digg/etc) however they don't work below IE8

http://www.projectfitfamilies.org/recipes.php?page=treats
It only works in IE8 quirks mode, standards mode doesn't do anything. I don't have IE6 or 7 to test it out on directly, but I imagine if IE8 quirks fails, then so will IE6 and 7.
Thanks!
Per request, my content header:
header("content-type:application/xml;charset=utf-8");
Not necessarily. To check out how your site works in IE7 standards mode, you can use the (F12) developer tools to change the browser mode. For IE6, I would recommend using IETester
Your reciepies.php header looks something like this:
header("content-type:application/xml-xhtml;charset=utf-8");
You need to replace it with something this:
header("content-type:application/xml;charset=utf-8");
IE does not function with the xhtml.
Hope this helps, Julian
You can use conditional comments to strip out this function. IE6/7 are very old browsers, better to write clean code than to put some hacks so site can work 100% fine (if it's not commercial project).
For my personal experience, i put links to every browser download site (beside IE) when i detect IE6/7 on personal sites. Because nice HTML4 code with modern CSS works really bad in 6/7.
Add #numberwrapper12 { margin-left:33px; } to make it work in IE8 standards mode.
Seems to work fine in IE7. IE6 has some issues. Most noticeably, your sprite arrows don't display properly and you should add `.arrowwrapper a { overflow-y:hidden; } to fix that. Also the '# of votes' doesn't stay on one line. Widening the votebox by a single pixel fixes that.

Categories