Background image layout issue

A client wants to have an image that takes up entire screen, on mouse over the menu would appear. The problem is the height vertical alignment for various screen sizes....What would be the most common sleek looking solution to this issue? Let's assume that the most common screen resolutio开发者_StackOverflown for the site's audience is 1024x768 but it should look good on smaller resolutions too (specifically for laptops).

My initial idea was to use an image such as 1000x600 and black background...any other ideas?

Thanks!

Compare the aspect ratio of the screen with the aspect ratio of the image, then scale the image appropriately. For example, if the aspect ratio (width / height) of the screen is larger than the aspect ratio of the image, then it's too wide - so scale the width of the image but keep the height the same size as the viewport. Visa versa for if it's smaller. I think you can use PHP to achieve what you want.