I'd like to read the article, when you find the link.
There is only one issue, if I'm doing my own custom design with a
smorgasbord of images etc. I have to find the largest, suppose a 5K
image, then do my design magic in Photoshop, then scale the design at
different resolutions. Question is, how many resolutions, one, three,
five... ?
Christopher
Tom Livingston <mailto:tom...@gmail.com>
Thursday, November 06, 2014 7:02 AM
Swapping bg images is easy enough with media queries, however, many
mobile device browsers will download images within other mqs. There is
an easy way to stop this in most cases.
For example, my base mobile styles (because you build pages
mobile-first, right?) have a bg img. I'll use that img until I hit a
breakpoint of 37em at which point I'll swap to a larger img. As is,
most browsers will download both imgs needlessly. You can easily stop
this by wrapping the base style img in an mq like:
@media screen and ( max-width: 37em){
Background img here
}
Notice the mq is a max-width of the next breakpoint.
Can't put my finger on the article and research that shows this, but
will look later.
HTH
Sent from my iPhone
Karl DeSaulniers <mailto:k...@designdrumm.com>
Thursday, November 06, 2014 12:29 AM
+1
Karl DeSaulniers
Design Drumm
http://designdrumm.com
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Norman Fournier <mailto:nor...@normanfournier.com>
Thursday, November 06, 2014 12:24 AM
Hello,
No, the idea is to swap out higher resolution images for the higher
resolution screens so that no visitor ever has to see distorted,
pixellated images.
Norman
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
