Re: [WSG] Lightbox++ and mobiles etc
If you're using a lightbox you must have some javascript in there
somewhere so:
You can use javascript to detect your viewport size and only fire your
lightboxes if it's of a certain size.
*Joseph R. B. Taylor*
/Web Designer/Developer/
--
Sites by Joe
/"Clean, Simple and Elegant Web Design/
Web: http://sitesbyjoe.com
Email: http://j...@sitesbyjoe.com
On 1/18/11 8:21 AM, designer wrote:
- Original Message -
*From:* David Laakso <mailto:da...@chelseacreekstudio.com>
*To:* wsg@webstandardsgroup.org <mailto:wsg@webstandardsgroup.org>
*Sent:* Tuesday, January 18, 2011 12:34 PM
*Subject:* Re: [WSG] Lightbox++ and mobiles etc
On 1/18/11 6:49 AM, designer wrote:
I making an html5 site with a few galleries, each one being a
grid of images 4 rows of three thumbnails. Clicking the
thumbnails provides a 600px wide image via lightbox++. The images
are all 600px wide, but the heights are different.
When it comes to making the galleries visible on a mobile phone I
do not have a problem since I've made the structure elastic and
the grid shrinks to 6 rows of 2 images. Fine. BUT : clearly,
the lightbox images simply do not fit on the small screen and I
wondered if anyone has solved the problem of how to stop the
lightbox working on small screens? Media queries?
All suggestions welcome.
Many thanks,
Bob
Try it the other way around: lay it out in mobile first?
@media only screen and (max-width:480px),only screen and
(max-device-width:480px) {...}
Best,
~d
--
http://chelseacreekstudio.com/
http://chelseacreekstudio.com/fa/
Thanks David,
I've done that, no problem. But for 'normal folk on larger
screens' I want the lightbox to show the larger images. I don't
want two sites . . .
??
Bob
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] Lightbox++ and mobiles etc
- Original Message -
From: David Laakso
To: wsg@webstandardsgroup.org
Sent: Tuesday, January 18, 2011 12:34 PM
Subject: Re: [WSG] Lightbox++ and mobiles etc
On 1/18/11 6:49 AM, designer wrote:
I making an html5 site with a few galleries, each one being a grid of
images 4 rows of three thumbnails. Clicking the thumbnails provides a 600px
wide image via lightbox++. The images are all 600px wide, but the heights are
different.
When it comes to making the galleries visible on a mobile phone I do not
have a problem since I've made the structure elastic and the grid shrinks to 6
rows of 2 images. Fine. BUT : clearly, the lightbox images simply do not fit
on the small screen and I wondered if anyone has solved the problem of how to
stop the lightbox working on small screens? Media queries?
All suggestions welcome.
Many thanks,
Bob
Try it the other way around: lay it out in mobile first?
@media only screen and (max-width:480px),only screen and
(max-device-width:480px) {...}
Best,
~d
--
http://chelseacreekstudio.com/
http://chelseacreekstudio.com/fa/Thanks David,I've done that, no problem. But
for 'normal folk on larger screens' I want the lightbox to show the larger
images. I don't want two sites . . .??Bob
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] Lightbox++ and mobiles etc
On 1/18/11 6:49 AM, designer wrote:
I making an html5 site with a few galleries, each one being a grid of
images 4 rows of three thumbnails. Clicking the thumbnails provides a
600px wide image via lightbox++. The images are all 600px wide, but
the heights are different.
When it comes to making the galleries visible on a mobile phone I do
not have a problem since I've made the structure elastic and the grid
shrinks to 6 rows of 2 images. Fine. BUT : clearly, the lightbox
images simply do not fit on the small screen and I wondered if anyone
has solved the problem of how to stop the lightbox working on small
screens? Media queries?
All suggestions welcome.
Many thanks,
Bob
Try it the other way around: lay it out in mobile first?
@media only screen and (max-width:480px),only screen and
(max-device-width:480px) {...}
Best,
~d
--
http://chelseacreekstudio.com/
http://chelseacreekstudio.com/fa/
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
[WSG] Lightbox++ and mobiles etc
I making an html5 site with a few galleries, each one being a grid of images 4 rows of three thumbnails. Clicking the thumbnails provides a 600px wide image via lightbox++. The images are all 600px wide, but the heights are different. When it comes to making the galleries visible on a mobile phone I do not have a problem since I've made the structure elastic and the grid shrinks to 6 rows of 2 images. Fine. BUT : clearly, the lightbox images simply do not fit on the small screen and I wondered if anyone has solved the problem of how to stop the lightbox working on small screens? Media queries? All suggestions welcome. Many thanks, Bob *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
