Just found an interesting application here:
http://mydeco.com/3d-planner/
I hear they use Javascript for making this (http://thenextweb.com/apps/2010/05/05/3d-room-planner-mydeco-aims-american-homes-ditches-flash/). Several 3D libraries (like WebGL) don’t run well in every browser, but this room planner works fine in most browsers (Chrome, IE, Firefox, Opera).
Does someone know what Javascript 3D library that can make something like that? I’m really new to something like this, not sure where to start. Honestly, I expect something that can be easy to use.
Or perhaps someone has experiences or suggestions about this? Please share if you do.
Thank you!
Have you looked at three.js? https://github.com/mrdoob/three.js
It uses either <canvas>, <svg>, or WebGL, so it should run in any "modern" browser, including IE9 (but not, I think, earlier versions).
Related
I'm using pretty recent CSS features such as viewport units and flex-boxes. These are great for making fluid layouts, and to get rid of extra-markup and dirty CSS hacks.
I'm using prefix-free to handle some vendor-prefix issues, but that got me thinking, is there any sort of script that can detect the use of recent CSS features and somehow make calculations in order to render the elements that use that feature correctly? (if the browser doesn't support those features, of course)
The site I'm making makes use of Bitcoins and WebSockets (and to my knowledge, socket.io falls back to long-polling), so I guess maybe many of the users will be somewhat "tech-savvy" and have recent browsers, but I don't really know what to expect, honestly. And it'd suck if the site looked completely broken for some people.
I'm the sole developer of this and the idea of making a bunch of the layout compatible with older browsers is... well, daunting. I just got started so I might as well use old CSS techniques, but I'd really like to use the latest stuff.
It really sucks that there is a lot of new, cool stuff, but old browsers are holding everyone back...
Thank you.
What you're looking for is commonly called a "polyfill".
There are many polyfills available... usually several for each feature. You can find packages like Webshim which come with many out of the box: http://afarkas.github.io/webshim/demos/
Use http://caniuse.com/ to check for browser compatibility. It often links to polyfills in the comments section.
I've been testing a website on mobile devices which uses a simple hide() / show() on a form. Works great on the desktop but not at all on mobile devices. Does anyone know if the functions are supported?
Using jQuery 1.5
Thanks
Ric
Yes, jQuery works fine on iPhone and Android.
yes works fine,
I had done in many projects for smartphones (iPhone, Android) specially and works as charm
you can be sure for this, because, new mobile web framework, jQtouch, and jQuery mobile is in jQuery and alot others too.
Ric I wouldn't say that combining all of the JS files together is really that bad of a solution, in fact I think that minifying and combining JS code is a great practice, unless you need people to be able to read your JS from source for some reason. Glad you got it fixed.
Okay, this is a terrible answer and thanks to everyone for their help.
In the end I combined all the JS files together. This fixed the script execution order problem on iPhone / Android. I'm not sure why it was happening on this particular site, and only on mobile phones.
It's not a very elegant solution and I do not recommend it. In my case it was for a temporary microsite so decided it was acceptable. Should I discover more about the problem I will post it here.
As Colt pointed out I was a bit rash saying it wasn't en elegant solution combining all the files together. In fact it is just what you should be doing! My frustration was that desktop and mobile browsers handled the JS different, and when developing the site I don't combine/minify the files until I know they work. Makes debugging and updating libraries easier.
As I feel bad for suggesting poor advice here's a little top tip: When on the production server I use Smart Optimizer (http://farhadi.ir/works/smartoptimizer) to handle joining, minifying, GZipping and caching the files for me. Means my dev code remains nicely seperated and it's easy to up jQuery, plugins etc but on the live site everything is nicely stuck together.
I was wondering if there are any packages available out there to make CSS3 capabilities available to browsers that do not support it yet.
The way I envision this, and I've been unable to find anything via search, is the JS would detect the browser and load its own library that essentially do the CSS3 functions using JavaScript.
I know there is a JS library to make PNG files work property on older IE browsers, I was wondering if anybody's been working on something to allow other things to work as well.
This would allow developers to utilize CSS3 in their web applications, and let the JS handle the comparability. I'd be willing to pay for something like this.
Thank you.
I recently came across a rather elegant new solution for CSS3 in IE. I think it's pretty close to what you want: http://css3pie.com/
The closest thing I have found to doing this is Dean Edwards' IE scripts. I don't think it fully supports all CSS3 features yet (as most of CSS3 is still in the works and hasn't been solidified), but what it will do, is allow you to use all common CSS selectors that normally don't work in earlier versions of IE. It really helps to make IE a more standards compliant browser and avoid the use of CSS hacks and/or multiple stylesheets. I've been looking for anything about CSS3 support in his script and haven't found anything yet. Like I said, it mostly allows the use of all the selectors, plus it does have a PNG fix built into it. Bonus!
http://code.google.com/p/ie7-js/
For your info, there's also such a pack to do stuff from allowing :hover in other stuff than anchors, there's also stuff to fix IE's screw-ups of the DOM etc.
But I don't think there's a definitive list/pack to do what you want.
If there was, it would have taken on the internet like a storm ;).
I don't believe there is such a library yet. It would be alot of work, and most are satisfied with graceful degradation in old browsers rather than trying to implement the missing features in javascript. However, there is a library that does the first half: feature detection. It's call modernizr: http://www.modernizr.com/
I am working on a legacy ASP.NET web site that is highly dependent on Internet Explorer. I would like to migrate it to non-IE browsers. I know there are a large amount of differences (as detailed at quirksmode.org, etc.), so I'm searching for a javascript library that can help minimize the amount of source I'd have to change.
I'm hoping that my lack of success in finding such a beast so far means that I'm just a bad google-er, and not that I'm just going to have to slog through coming up with replacements/workarounds for all of IE's proprietary functionality that this site currently uses (it uses quite a bit).
Any help you can provide will be greatly appreciated. Thanks!
Frankly you should probably convert the site to a well known multi-platform javascript library such as ExtJs or jQuery.
This'll let you standardize your javascript to work on all browsers (including ie)
I suspect that you're going to have to slug through a little. I don't know much about IE, but I'm really happy when I use jQuery. There are many functions and modules that expand the functionality available. And there is lots of help here on Stack Overflow and at api.jquery.com.
Good luck!
I am currently half-decided to use Kohana + Zend as needed for the PHP part. What I would need next is an excellent base for JavaScript code. There are a bazillion of contenders here and choosing isn't exactly as easy as with PHP.
I would need practically everything from form posting and retrieving results to skinnable widgets and animations. For this reason using multiple libraries will probably be a must, as no one framework can do it all. The requirements I have would be this (initial list):
Good browser support. WebKit-based is hardly an issue and Firefox 3+ is good. However, I'm looking at you Internet Explorer. IE 6 can be ditched, seriously, but 7+ support is needed.
Good performance. While WebKit has had a stupidly fast JS implementation for quite a while (and Chrome even before), Firefox has only recently got TraceMonkey and don't even get me started on Internet Explorer. While it is true that you can't do much about IE as anything will be slow, I don't want to try running Chrome Experiments in the others either.
Excellent support. This is a total must. The better the support, the more inclined will I be towards a library.
I am currently looking into jQuery as it is a very neat library, but the quality of plugins is questioned by some. Processing.js looks extremely promising, but IE does not support canvas, thus something has to be done about that and I am not sure how it could be replaced.
Go with a known library that is used by many sites. This will ensure all 3 of the points you have mentioned.
Personally, I would go with jQuery for these above reasons:
Great cross browser support
Good performance, as it is a thin api layer
Excellent support. Good documentation, loads of other devs
Although jQuery seems to be the most used library these days, there are other very good candidates as well.
One of them are YUI Library.
YUI has excellent documentation, and support. And the source code is really good.
YUI is developed by Yahoo!, where Douglas Crocford is architect (the author of JavaScript: The Good Parts, and the man behind JSON). Yahoo! is well known for their focus on JavaScript development.
YUI has good browser support and is fast and robust.
If it's war simulation and you have custom objects that you want to animate beyond the simple CSS effects and animations, then canvas tag is your best bet. It's as close as you can get to Flash but much more smoother. Processing.js looks really good for manipulating the canvas.
If that's the core component of your game, then I see the other libraries as adjunct to Processing.js that can be scrapped out without any deep commitments. That said, jQuery is great if you're dealing heavily with the DOM. It has really good support and community. MooTools is highly modular and has been traditionally strong with animations. YUI is a great library too, but a little verbose for my taste. Thought, Yahoo has made heavy changes with v3 to fix that. And a bunch of other libraries, that I don't use at all.
Dojo is a great library for writing web applications; however, never having written a game, I'm not sure if it is well suited for that sort of application. I must warn you though that the Dojo documentation is crap. Absolute crap. On the other hand, things like dojo.hitch, dojo.require, and dojo.partial are absolute joys.
I would try to avoid using cross-cutting libraries (like Dojo+jQuery) as much as possible. There's not really a good reason to do it and will create bloat and confusion in your application from day one.
That said, using multiple, non-overlapping libraries does make sense for a project like this. You might want to look into using Processing.js for visual needs and either Dojo or jQuery for your core.
Some other things to consider. Targeting IE, even IE8, for JavaScript game development is a bit ridiculous because of its slow performance and lack of canvas support. Also, according to John Resig, developing games in JavaScript is hard.
Have you considered being a pioneer (wink) and trying something out in 03D?