What’s New to Checkout ? Mozilla Firefox 10

New Firefox 10 release date is January 31, 2012, which is my official birthday also and it has been very popular for its new feature very quickly in just 2 days. So I also started testing out the New Mozilla Firefox 10.0 and here are some quick notes which you will also going to notice or you should notice if you are a Web Designer or Developer while using the new Firefox 10.

New Mozilla Firefox 10 Release notes:

• The forward button is now hidden until you navigate back
• Anti-Aliasing for WebGL is now implemented
• Full Screen APIs allow you to build a web application that runs full screen
• CSS3 3D-Transforms are now supported
• New <bdi> element for bi-directional text isolation, along with supporting CSS properties
• Inspect tool with content highlighting, includes new CSS Style Inspector
• Added IndexedDB APIs to more closely match the specification

Fixes in New Mozilla Firefox 10 Release notes:

• Mac OS X only – after installing the latest Java release from Apple, Firefox was crashing when closing a tab with a Java applet installed
• Some users was experiencing a crash when moving bookmarks  

What’ New In New Mozilla Firefox 10 Release ?? Detailed !

The forward button is now hidden until you navigate back

In Every browser even in chrome (which I think is best browser till date after FF) the both Previous and Forward buttons keeps showing all the time for no reason
And till now the Firefox 10.0 is the first browser which got this new idea to hide the Forward button until it is actually required, means you can’t go to next page of a website by using a forward button on browser windows so it is not required for that at all, but when you click on previous button you can then only use the forward button and then only you need it and that’s what Mozilla has done.

Anti-Aliasing for WebGL is now implemented

In computer graphics, Anti-Aliasing is a software technique for diminishing jaggies – stairstep-like lines that should be smooth, In previous versions of Firefox Anti-Aliasing was not much better and that was causing problem or you can say not good when you are viewing or creating animations with CSS3 basically in that case when you rotate line using css3 property it will some where look like stairstep, check the image below to be clear about this.

Anti-Aliasing reduces the prominence of jaggies by surrounding the StairSteps with intermediate shades of gray.

 

Full Screen APIs allow you to build a web application that runs full screen

Hmmm! What is this ?
This is an experimental feature in Firefox 10 Release. If You are not a web application builder then you may skip this point as this feature is basically for technical App builders only and I am not a application builder so I don’t have much Idea about this feature but what Mozilla say about this is:

The full-screen API provides an easy way for web content to be presented using the user’s entire screen.

If You are a Application Builder then you should check out this page to know how to enable the The full-screen API feature.

CSS3 3D-Transforms are now supported

CSS 3D Transforms extends CSS Transforms to allow elements rendered by CSS to be transformed in three-dimensional space to make it look very dynamic to user. This feature was already present in Chrome and Safari and Now Firefox 10 also has it. CSS 3D Transform can be used to create very good animations, check out the video below to see the best use of CSS 3D Transform feature.

Although Firefox officially announced this feature but on my browser it is not working at all  So, I hope this will be fixed soon or if this problem is only on my PC then I will try to fix it

New <bdi> element for bi-directional text isolation, along with supporting CSS properties

The <bdi> tag isolates a part of text that might be formatted in a different direction from other text outside it.
Check this line in Internet Explorer and then in Firefox 10 and try to notice the change:

User إيان: 90 points

This element is very useful when your are trying to embed user-generated content with an unknown directionality.

Inspect tool with content highlighting, includes new CSS Style Inspector

This is biggest and most popular feature of Firefox 10 release A great and highly useful feature for web designers and developers, with Inspect tool you can make modifications on any site from front end and can see the changes in real time and when you are happy with the changes you can apply it to your original files so it can take effect everywhere.
The Same tool also includes content highlighting feature which can be very useful if you want to mention a particular area in a screenshot as below.

 

Previous version was also having this feature but missing the best thing CSS, So that’s wasn’t good at all.
What exactly you can do with this Inspect Tool ? Check the list:

• Inspecting Content Documents
• Inspecting Chrome Documents
• Inspecting arbitrary URLs
• DOM (Document Object Model) Inspector viewers
• Selecting elements by click
• Searching for Nodes in the DOM
• Updating the DOM Dynamically

New Version Includes:

• Content highlighting
• CSS Style Inspector

Although there are many features in this tool, I didn’t like it much, as there is already a 100 times better similar tool in Firefox which is available as add-on.
Something which I didn’t like are:

• Arrow keys not working with CSS Inspector, which is very useful while making exact changes
• Auto complete is very important which is missing

So, What you think about this Release of Mozilla Firefox 10, Let us know in your comments below.