PricewaterhouseCoopers

API/Backend for IOS app produced for internal use at PricewaterhouseCoopers. Registration, authentication, gaming, score, metrics via API and an administration panel.

Year 2016
Produced by Strawberry Hill
My contribution PHP, MySQL
Url n/a

Image downscaling browser issues

Responsive design forces us to scale images. We are typically going to have two or three image sizes to work with suited for desktop, large retina and small retina screens. Sometimes we can just use desktop size for small retina screens. In the past year/s while implementing large scale systems that serve images of different size I’ve noticed some inconsistencies in performance between the largest browsers. If an image is scaled down too much, it will be jagged in Explorer. If it’s scaled down too little (i.e. just a bit) it will be blurry in FireFox. There is an obvious dilemma here as I can not find a size that accomodates both. Just now though I found this amazing css hack.

Prented that you are rotating the image, and Firefox will clear right up.

.image-scale-hack {
transform: rotate( 0deg );
}

This means I can stick to scaling only as much as absolutely needed which is what works best in Explorer, while the images stay fresh in Firefox. On top of this, users won’t have to load large images on desktop because they look better. Haleljuah.

Eneland

WordPress plugin for connection to Fasad real estate system. Integration with WordPress theme.

Year 2015
Produced by Strawberry Hill
My contribution HTML, CSS, JS, PHP
Url eneland.se