質問: ### 前提・実現したいこと jQueryプラグインSlickで、YouTubeの動画をiframeで埋め込んでスライドさせているのですが、 動画部分(iframe部分)だけスワイプが効きません。 (※テキストを入れている部分はフリックできるので、フリック自体は有効になっている) 動画部分をスワイプしても横にスライド出来る様にしたい。 ### 発生している問題・エラーメッセージ Youtubeの動画部分(iFrame部分)のスワイプが効かない ### 該当のソースコード 【HTML】 動画 動画タイトル ※注意事項 【javaScript】 $(function() { $('.singleSlider').slick({ }); }); ### 試したこと swipe:true,を指定する iframenを過去込んでいるDivに-webkit-overflow-scrolling: touch;を指定する ### 補足情報(言語/FW/ツール等のバージョンなど) jQueryバージョン:1.11.2
回答: スマホではiframeのスクロールなどが効かないのが原因ぽいというところまでは分かりました。 そのため、時間も迫っていた事もあり、空Divを作り、CSSでYouTubeの動画の上に被せる事により、スワイプ出来る様にしました。 javaScriptが分かる方は↓を参考にslickの中に組み込めたら、もっとスマートに出来るかもしれません。。 【iframe内をタッチしたらイベントが起きるようにしたい】 ※$(window).on("load", function(e){})を使い、$("#iframe").contents().find("body")で、iframe内のbodyに対し、イベントハンドラを登録する。