tarstarkes
commented
8 years ago UPDATE: I have done some more investigation and what seems to be happening is that the swipe is not registering on the slides with the videos. I attempted to add a class to the iframe and add it to my selector for slides; however, the video I loaded from the database became separated from the slideshow and remained static beneath it; while when I attempted to add a new video to the slideshow using a working url (mind you this created an identical video div/iframe as the one pulled from the database) the same problem of not registering the swipe occurred.By adding previous and next buttons to the slideshow I have deduced that the slideshow itself remains unbroken; however, the same problem of not being able to register a swipe on video slides remains.
Ok I have searched through all of the open and closed issues and can find nothing close to what is going on here so I am writing to open a new issue.
The Situation: I am currently using the Cycle 2 plugin for app development using phonegap buld. (phonegap build essentially uses JS, HTML, CSS, and XML to develop apps for multiple mobile platforms) currently I am developing an app for android and IOS. There is a desktop application for phonegap build which allows me to do a quick build of the app so I can test certain aspects on different devices, currently I am testing on IOS 8.4 and not certain if this problem persists on any android builds yet.
The Problem: I have Cycle 2 set up to create slides of only specific divs so I do not end up with children divs being selectors. This part seems to be working just fine as the problem does not seem to persist in chrome on app view. The problem is that when I load the slideshow on IOS I see the final slide in the background. That slide happens to be a video in an iframe which is wrapped in a div with the appropriate id for selecting it as a slide . What is more, when I advance the slider to that slide, the video appears without issue; however, the slideshow breaks and I am unable to advance/revert to the next or previous slide BUT I am able to play the video! I am rather limited on debugging since I cannot run plugins on the desktop app the problem is only occurring on mobile IOS.
Tested solutions: I have tried to set the opacity on the sentinel div to 0 !important to get video in the background not to show up, but to no avail.
The code: Here is what the typical video div looks like: <div id="remoteVideo">
<iframe width='auto' height='200px' src="http://www.youtube.com/embed/bW2EbLhi14w" data-id="1865">
</iframe>
</div>
Here is what the typical image div looks like: <div id="remoteImage">
<img id="6" src="http://i219.photobucket.com/albums/cc216/xany67/Psychodelic/psychodelic-75_domi.jpg" />
</div>
Here is my slideshow cycler, mind you the cycler is told to cycle only AFTER the elements exist in the DOM: $('.customImageCycler').cycle({ speed: 500, swipe: true, fx: 'scrollHorz', timeout: 0, slides: $('#localImage, #localVideo, #remoteImage, #remoteVideo') });
It is probably important to note that I am using the swipe plugin with cycle2 and I do know that there was a problem with IOS6 and the swipe feature concerning timers but it seems that issue has been resolved since IOS7 so I do not believe that is the issue here. Any input would be greatly appreciated, if you need any more information than this just let me know. Thanks and I look forward to hearing from you.