PDA

View Full Version : CMotion Image Gallery works with mouse, not with touchscreen



aharvey
07-03-2014, 04:19 PM
1) Script Title: CMotion Image Gallery

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex4/cmotiongallery.htm

3) Describe problem: Title pretty much says it all. Using a mouse and a traditional computer monitor, this script performs exactly as intended: hover over the strip, and images slowly (or quickly, depending on where you hold the mouse) scroll in the proper direction. Use your finger on a touchscreen (Samsung CY-TM55LCC - 55 Touch Overlay on a Samsung 55" monitor) in the same fashion, and nothing happens. The more traditional scrollbars respond to the touch as expected on this touchscreen, but aren't a desirable option for what I'm trying to do. Any suggestions would be greatly appreciated!

Cheers,

Alan

ddadmin
07-03-2014, 09:37 PM
To make this script mobile friendly, the easiest way is probably just to add some basic swipe functionality to it. I'll try to get to that in the next few days...

ddadmin
07-04-2014, 11:10 PM
I've added swipe capability to the carousel- all of the files have been changed- .js, .css, and the markup: http://www.dynamicdrive.com/dynamicindex4/cmotiongallery.htm

aharvey
07-05-2014, 06:27 PM
Cool, can't wait to try it out (won't have access to the touchscreen for a couple of days)!

Thanks! Alan

aharvey
07-05-2014, 09:44 PM
Cool, can't wait to try it out (won't have access to the touchscreen for a couple of days)!

Thanks! Alan

Hmm, realized that I could try it out on my iPad in the meantime. So my original page combined the CMotion Image Gallery with the Facebox script. Both features worked great together on my Mac; on the touchscreen and iPad (just confirmed) the CMIG did not work, but the Facebox part did. I replaced all the CMIG files and markup as instructed, with each image line as follows:

<li><a href="#lbeati" rel="facebox"><img src="images/beati_th.jpg" border=1></a></li>

meaning I removed the OnClick bit. This still works fine on the Mac, and the CMIG part works great on my iPad, but now the Facebox part is not working. That is, tapping on each image no longer brings up the Facebox. In comparing the two js files, I don't see any duplicate variable names, and am not sure why Facebox no longer works on the tablet. Any suggestions would be most appreciated!

By the way, the enlargeimage option in the new CMIG is probaby not a good option for our new touchscreen setup, because I'm trying to avoid opening new browser windows if at all possible.

Thanks!

Alan

ddadmin
07-08-2014, 06:15 AM
Ah ok I can confirm onClick events no longer fire in touch devices inside the carousel with the latest update. I haven't found a quick fix for the problem yet; I'll see what I can come up with before the end of the week.

aharvey
07-08-2014, 04:02 PM
Excellent, thanks very much!

aharvey
07-18-2014, 08:21 PM
Uh oh, I'm starting to worry that it's not an easy task to incorporate both click and swipe in the same javascript! So far I haven't found any other examples of both being used at the same time.

gatomadrid
09-01-2015, 06:24 PM
Uh oh, I'm starting to worry that it's not an easy task to incorporate both click and swipe in the same javascript! So far I haven't found any other examples of both being used at the same time.

Did anyone solve the problem or find another solution?

ddadmin
09-02-2015, 08:29 PM
Ok, try the below modified motiongallery.js file. It takes a very different approach to scolling in touch devices, by simply enabling overflowing in those devices. The result is smoother scrolling, less code, and links that work. Let me know if there are any issues.