jQuery Facebox dialog with opaque background

A few months ago I posted how to make the web page behind a jQuery Facebox inline popup grey out using an opaque layer that would show and hide before and after the facebox dialog. A reader recently emailed me to let me know there’s an easier way to do this using the undocumented opacity setting which I will show how to do in this post.

parseInt(’08’) returns 0 with Javascript

I came across a rather interesting problem with the Javascript parseInt() function a couple of days ago; if the value is a zero padded string and is ’08’ or ’09’ then parseInt() will return 0. This post looks at why 0 is returned and how to solve the problem.

parseInt(’08’) returns 0

The leading zero in the string tells the Javascript engine that it is an octal number. Because 8 and 9 are not valid numbers in octal, parseInt returns 0. This is expected behaviour because they are not valid octal integers and parseInt returns 0 because the first valid number encountered is a zero.

The solution

After a quick bit of research when I had this problem, I discovered the parseInt function has an optional ‘radix’ parameter which specifies the base to use. By passing 10 as the base it solves the leading 0 issue, for example:

alert( parseInt('08', 10) );

will show the number 8 in an alert dialog, whereas:

alert( parseInt('08') );
 

would display 0.

Conclusion

To be on the safe side it’s probably always a good idea to pass the radix parameter to the parseInt function to ensure the values returned are what you expect them to be, especially if they might contain leading zeroes.

<

Master Mobile Web Apps with jQuery Mobile 3rd Edition

My friends over at elated.com have recently released the 3rd edition of their "Master Mobile Web Apps with jQuery Mobile" e-book. I had a brief read of one of the earlier editions and it’s a great book and I’ll be using it as a reference at some point in the future. In the meantime, here’s some info about the book and where to buy it from.

Fixed number of digits after the decimal place with Javascript

As well as supporting various rounding functions, Javascript has the toFixed() method to have a specific number of digits after the decimal place. This function works in all modern browsers including Internet Explorer from 5.5+.

Number.toFixed(digits)

Simply pass the number of digits that should be after the decimal place and the string returned will be rounded to that number if there are more or zeros added if there are less.

Some examples:

document.write( 1.1.toFixed(2) + '<br>' );
 document.write( 1.12.toFixed(2) + '<br>' );
 document.write( 1.123.toFixed(2) + '<br>' );
 document.write( 1.125.toFixed(2) + '<br>' );
 document.write( 1.125.toFixed(4) + '<br>' );

These will write out to the document:

1.10
 1.12
 1.12
 1.13
 1.1250

See also my rounding numbers with Javascript post for some other rounding methods which do not set a fixed number of digits after the decimal place.

Javascript frame buster

It’s really annoying when instead of linking directly to your site in a full browser window another site links using an <iframe> or <frameset> <frame>. There’s a really simple method to bust out of frames using Javascript but as I discovered yesterday if you also use iframes in your own site the commonly used frame buster needs some improvement.