dcsimg
Login | Register   
RSS Feed
Download our iPhone app
TODAY'S HEADLINES  |   ARTICLE ARCHIVE  |   FORUMS  |   TIP BANK
Browse DevX
Sign up for e-mail newsletters from DevX

By submitting your information, you agree that devx.com may send you DevX offers via email, phone and text message, as well as email offers about other products and services that DevX believes may be of interest to you. DevX will process your information in accordance with the Quinstreet Privacy Policy.


Tip of the Day
Language: Web
Expertise: Intermediate
Jan 13, 2000

WEBINAR:

On-Demand

Application Security Testing: An Integral Part of DevOps


Display Graphics Using the colorDepth Property

Browsers Targeted: Internet Explorer 4+

Designing effective Web graphics is always a challenge—you want to provide the best looking graphics on all platforms, but when one person runs their browser in 8-bit color (for example, 8 bits or one byte to represent a look-up table of colors) and another runs it at 32-bit color, providing the best experience for both of them can prove difficult. One way to partially circumvent this problem is to use the screen.colorDepth property. This read-only property queries the system and returns the number of bits per pixel currently set.

 
<div id="monitorDepth" />
 
<script language="JavaScript">
	monitorDepth.innerHTML=("This monitor is currently set to
 "+screen.colorDepth+" bit depth.");
</script>

Once you have the color depth, you can use this information to set the characteristics of images to display at a higher color depth. For example, this script will automatically load a low color-depth image first, then if the resolution supports it, it will load the higher resolution image:

 
<img id="scientist" src="JillianHiPriestess.gif" /><button 
onclick="upgradeImage()">Upgrade Image</button>
 
<script language="VBscript">
    function upgradeImage()
        if (screen.colorDepth=16) or (screen.colorDepth=24) or _
            (screen.colorDepth=32) then
            alert "Image can upgrade."
            scientist.src=left(scientist.src,len(scientist.src)-4)+".jpg"
        end if
    end function	
</script>
Kurt Cagle
 
Comment and Contribute

 

 

 

 

 


(Maximum characters: 1200). You have 1200 characters left.

 

 

Sitemap
Thanks for your registration, follow us on our social networks to keep up-to-date