Veľa webizajnérov tento trik pozná a používa, kto nepozná, teraz má možnosť sa s ním zoznámiť.
Občas sa stane, že potrebujete pomocou width a height parametrov (či už v HTML kóde, alebo v CSS) zmeniť veľkosť obrázku. Tým samozrejme obrázok stráca na kvalite (či už ho zmenšujete, alebo nebodaj zväčšujete). V Internet Exploreri 6 a 7 (IE6, IE7) však obrázok stratí na kvalite ešte viac. Riešenie je vcelku jednoduché…
Pre tieto 2 „prehliadače“ je vhodné použiť funkciu -ms-interpolation-mode: bicubic;. Samozrejme po jej definovaní v hlavnom CSS súbore sa stane vaše CSS nevalídne, preto je vhodné využiť externé štýly pre IE6 a IE7.
Príklad využitia externých štýlov pre IE6 a IE7:
<!--[if IE 6]><link rel='stylesheet' href='css/ie6.css' type='text/css' media='screen' /><![endif]-->
<!--[if IE 7]><link rel='stylesheet' href='css/ie7.css' type='text/css' media='screen' /><![endif]-->
Potom v ie6.css a ie7.css definovať -ms-interpolation-mode: bicubic; aplikovať na požadované obrázky.
Použitie Bicubic Scaling v CSS
#content .box img { -ms-interpolation-mode: bicubic; }
Bicubic Scaling v praxi:
