responsive webdesign - swipe effect for lightbox
responsive webdesign - swipe effect for lightbox
Hi all
We are working on our first website with phpwcms for responsive webdesign: pull up on your iPhone or iPad http://traumkleid.com.
Now to the lightbox - watch the problem here at http://traumkleid.com/index.php?de_rembo-styling by clicking on one of the pictures. The light box shows as per default settings in the image-CNT-Parts a "prev" and "next" on a mouse-over status. And of course mobile devices have nothing like a mouse-over (and no, the bamboo stylus hovering over the iPad doesn't do anything either here ).
I found for example http://swipejs.com but since I'm not a programmer I'm a little helpless here …
Does anybody have any experience with this and can help?
Thanks in advance for any help!
macangelo
We are working on our first website with phpwcms for responsive webdesign: pull up on your iPhone or iPad http://traumkleid.com.
Now to the lightbox - watch the problem here at http://traumkleid.com/index.php?de_rembo-styling by clicking on one of the pictures. The light box shows as per default settings in the image-CNT-Parts a "prev" and "next" on a mouse-over status. And of course mobile devices have nothing like a mouse-over (and no, the bamboo stylus hovering over the iPad doesn't do anything either here ).
I found for example http://swipejs.com but since I'm not a programmer I'm a little helpless here …
Does anybody have any experience with this and can help?
Thanks in advance for any help!
macangelo
Last edited by macangelo on Sun 30. Dec 2012, 20:57, edited 1 time in total.
Webdesign from Düsseldorf - made with phpwcms (most of it):
http://eyelikeit.com/index.php?de_beispiele-webdesign
http://eyelikeit.com/index.php?de_beispiele-webdesign
Re: responsive webdesign - swipe effect for lightbox
Ask santscho... he has a solution basing on swipe!
Re: responsive webdesign - swipe effect for lightbox
The standard lightbox of phpwcms is not responsive. big photos are a problem especially on smartphones. The images will not fit automatically to the viewport of such devices. I am currently working on a responsive lightbox (jquery based). Even this lightbox is responsive, it will not work with swipe effect. There are a left and right arrow for navigation. It is also not a replacement for the standard lightbox yet. Means, you need to use the CP Images (special) instead. But it supports cropping of thumbnails and zoomed image and also captions. Maybe I can drive Oliver to replace the core lightbox with my solution in a future release of phpwcms. I have to discuss this with him.
The second solution I have is also for the CP Images (special). The engine I am using is "photoswipe" (http://www.photoswipe.com). All features of photoswipe are supported (pinch zoom, swipe, captions, slideshow...).
I am going to launch two full responsive phpwcms websites within the next days and will also explain features and maybe provide some sources. The websites will also show some other touch swipe based features (image sliders and teasers).
Most probably, I will provide the solutions my clients paid for only for regular solution-contributors in this forum. "Help seekers only" will have to donate to get the full resources. But this is subject of discussion with my forum friends and Oliver.
[EDIT] macangelo, don't worry, you will get the stuff
The second solution I have is also for the CP Images (special). The engine I am using is "photoswipe" (http://www.photoswipe.com). All features of photoswipe are supported (pinch zoom, swipe, captions, slideshow...).
I am going to launch two full responsive phpwcms websites within the next days and will also explain features and maybe provide some sources. The websites will also show some other touch swipe based features (image sliders and teasers).
Most probably, I will provide the solutions my clients paid for only for regular solution-contributors in this forum. "Help seekers only" will have to donate to get the full resources. But this is subject of discussion with my forum friends and Oliver.
[EDIT] macangelo, don't worry, you will get the stuff
Schon Konfuzius sagte: "Sei kein YAML-Lappen". YAML-phpwcms-Integration auf http://www.yaml.phpwcms.org
Re: responsive webdesign - swipe effect for lightbox
Hi Santscho
that's good news! Might I ask if you have set yourself a timeframe? I just ask because we originally had planned to go online with this this weekend and would consider to wait for you
And then I'm of course eager to know how you like what we did. (you can also write a polite feedback, but what I would like to know is what you really think!).
looking forward to hearing from you!
Best
macangelo
that's good news! Might I ask if you have set yourself a timeframe? I just ask because we originally had planned to go online with this this weekend and would consider to wait for you
And then I'm of course eager to know how you like what we did. (you can also write a polite feedback, but what I would like to know is what you really think!).
looking forward to hearing from you!
Best
macangelo
Webdesign from Düsseldorf - made with phpwcms (most of it):
http://eyelikeit.com/index.php?de_beispiele-webdesign
http://eyelikeit.com/index.php?de_beispiele-webdesign
Re: responsive webdesign - swipe effect for lightbox
What do you mean with timeframe? One of the responsive website is online. This is a page with a responsive lightbox feature: http://www.asiangeo.com/index.php?alternating-currency
Schon Konfuzius sagte: "Sei kein YAML-Lappen". YAML-phpwcms-Integration auf http://www.yaml.phpwcms.org
Re: responsive webdesign - swipe effect for lightbox
Hi santscho
Looks great! Complements!
What I saw here is the lightbox effect with one image. Does it also work with several images? And being in the lightbox, can you swipe to the next image?
Can I contact you regarding the conditions upon which I could benefit from your work?
Best
macangelo
Looks great! Complements!
What I saw here is the lightbox effect with one image. Does it also work with several images? And being in the lightbox, can you swipe to the next image?
Can I contact you regarding the conditions upon which I could benefit from your work?
Best
macangelo
Webdesign from Düsseldorf - made with phpwcms (most of it):
http://eyelikeit.com/index.php?de_beispiele-webdesign
http://eyelikeit.com/index.php?de_beispiele-webdesign
Re: responsive webdesign - swipe effect for lightbox
Nope, the lightbox works with all the photos are used in the same content part. At the moment, you need to browse the images with the left/right arrows. There is no swipe function, but I am working on a solution for it. The lightbox is responsive, but I discovered that the captions (if too long) do not have a line break when the screen is too small. Need to fix this. otherwise, text gets cut off left and right on small screens.
BTW: The slider on this page (http://www.asiangeo.com/index.php?asian-geographic) is fully responsive and works with touch swipe. Also the magazine slider at the bottom of the page.
BTW: The slider on this page (http://www.asiangeo.com/index.php?asian-geographic) is fully responsive and works with touch swipe. Also the magazine slider at the bottom of the page.
Schon Konfuzius sagte: "Sei kein YAML-Lappen". YAML-phpwcms-Integration auf http://www.yaml.phpwcms.org
Re: responsive webdesign - swipe effect for lightbox
I'm interested in this solution too
It's mostly all about maintaining two or three customer's sites Still supporter for the band Mykket Morton. Visit Mykket Morton on FB. Listen Mykket Morton and live videos on youtube.
Now building a venue for young artists to get wet on stage, rehearsal rooms, a studio, a guitar shop - yes I'm going to build some guitars.
Now building a venue for young artists to get wet on stage, rehearsal rooms, a studio, a guitar shop - yes I'm going to build some guitars.
Re: responsive webdesign - swipe effect for lightbox
Hi Santscho
So what do I need to have, to purchase, and to do, to have a responsive and swipy lightbox?
Thank you very much
macangelo
So what do I need to have, to purchase, and to do, to have a responsive and swipy lightbox?
Thank you very much
macangelo
Webdesign from Düsseldorf - made with phpwcms (most of it):
http://eyelikeit.com/index.php?de_beispiele-webdesign
http://eyelikeit.com/index.php?de_beispiele-webdesign
Re: responsive webdesign - swipe effect for lightbox
You don't need to pay for it. U will just get it. But there is currently no swipe for the lightbox. I need to figure it first. No time at the moment.
Schon Konfuzius sagte: "Sei kein YAML-Lappen". YAML-phpwcms-Integration auf http://www.yaml.phpwcms.org
Re: responsive webdesign - swipe effect for lightbox
Dear Santscho
thank you for your reply, the information, and the kind offer for me to get the lightbox. Might I ask you to send the non-swipe-but-responsive lightbox for know, so that I can go online?
Thanks a lot
macangelo
thank you for your reply, the information, and the kind offer for me to get the lightbox. Might I ask you to send the non-swipe-but-responsive lightbox for know, so that I can go online?
Thanks a lot
macangelo
Webdesign from Düsseldorf - made with phpwcms (most of it):
http://eyelikeit.com/index.php?de_beispiele-webdesign
http://eyelikeit.com/index.php?de_beispiele-webdesign
Re: responsive webdesign - swipe effect for lightbox
But are you aware that this lightbox only works with CP images (special)?
Schon Konfuzius sagte: "Sei kein YAML-Lappen". YAML-phpwcms-Integration auf http://www.yaml.phpwcms.org
Re: responsive webdesign - swipe effect for lightbox
now I am! thanks!
Webdesign from Düsseldorf - made with phpwcms (most of it):
http://eyelikeit.com/index.php?de_beispiele-webdesign
http://eyelikeit.com/index.php?de_beispiele-webdesign
Re: responsive webdesign - swipe effect for lightbox
a complete solution from Oliver downloadable hereé http://forum.phpwcms.org/viewtopic.php? ... 8&start=15
Schon Konfuzius sagte: "Sei kein YAML-Lappen". YAML-phpwcms-Integration auf http://www.yaml.phpwcms.org