html Youtube benutzerdefinierte Play-Taste

Die Wiedergabe-Taste des YouTube-Players funktioniert gut, aber meine benutzerdefinierte Play-Taste funktioniert nicht.html Youtube benutzerdefinierte Play-Taste

example is here

** EDIT **

The current JSFiddle jetzt funktioniert auf einem PC/Mac, aber nicht auf einem iPad.

** EDIT 2 **

iframed youtube w/external play button

** EDIT 3 **

This isn't possible right now

Quelle

2012-03-30 Jacksonkr

Aus irgendeinem Grund sind Einschränkungen vorhanden. Dies funktioniert nicht, wenn Sie auf einem iPad in HTML5 sind. Mein Jsfiddle funktioniert jedoch für Desktop-Browser.

Bitte senden Sie zurück, wenn Sie diese bekommen haben für ipad zu arbeiten, und ich werde wieder Zeichen Sie als Antwort.

Quelle

2012-04-26 14:17:39 Jacksonkr

Versuchen Sie folgendes:

http://jsfiddle.net/CHu7H/

jedoch würde ich rec Ich möchte etwas wie swfobject verwenden, um das Video einzubetten.

https://developers.google.com/youtube/js_api_reference#Embedding

Quelle

2012-03-30 21:53:01 stewe

funktioniert gut, nur nicht auf einem iPad :(Ich hätte erwähnt, dass das ist wirklich, was mich hier an erster Stelle. – Jacksonkr

Ich würde versuchen, es mit einem -> https://developers.google.com einbetten/youtube/iframe_api_reference – <span class="text-secondary"> <small> <a rel="noopener" target="_blank" href="https://stackoverflow.com/users/511300/">stewe</a></span> <span></span> </small> </span> </p> </div> </div> </div> <div itemprop="comment" class="post-comment"> <div class="row"> <div class="col-lg-1"><span class="text-secondary">+0</span></div> <div class="col-lg-11"> <p class="commenttext">aye aye. nun, die Spieler in der iPad funktioniert jetzt, aber das funktioniert nur noch playbutton auf einem Computer! wtf .. JS Fiddle Link w/iframe in der neuesten bearbeiten ist. – <span class="text-secondary"> <small> <a rel="noopener" target="_blank" href="https://stackoverflow.com/users/332578/">Jacksonkr</a></span> <span></span> </small> </span> </p> </div> </div> </div> </div> </div> </article> <article class="board-top-1 padding-top-10"> <div class="post-col vote-info"> <span class="count">0<i class="fa fa-thumbs-up"></i></span> </div> <div class="post-offset"> <div class="answer fmt"> <p>Ich hatte gerade auch dieses Problem Ich entschied mich, HTML5 auszuprobieren und es funktionierte. Das einzige Problem ist, dass Sie die Videos auf Ihrem Host hosten müssen.</p> <p>(Funktioniert auf iPad) <a href="http://www.w3schools.com/html/tryit.asp?filename=tryhtml5_video_js_prop" rel="nofollow">http://www.w3schools.com/html/tryit.asp?filename=tryhtml5_video_js_prop</a></p> </div> <div class="post-info"> <div class="post-meta row"> <p class="text-secondary col-lg-6"> <span class="source"> <a rel="noopener" target="_blank" href="https://stackoverflow.com/q/22201340">Quelle</a> </span> </p> <p class="text-secondary col-lg-6"> <span class="float-right date"> <span>2014-03-05 14:58:27</span> </p> <p class="col-12"></p> <p class="col-12"></p></div> </div> </div> </article> <article class="board-top-1 padding-top-10"> <div class="post-col vote-info"> <span class="count">0<i class="fa fa-thumbs-up"></i></span> </div> <div class="post-offset"> <div class="answer fmt"> <p>Jeder Youtube eingebetteten Player enthält einen Spieler-ID, die in Form ist:</p> <pre><code class="prettyprint-override">player_uid_\d+_1 </code></pre> <p>wie - player_uid_271874942_1</p> <p>So einfach eine <code class="prettyprint-override">regex search</code> für <code class="prettyprint-override">player_uid_\d+_1</code> im <code class="prettyprint-override">page source</code> und fügen Sie alles folgende js Sie wollen:</p> <pre><code class="prettyprint-override">var player = document.getElementById(playerId); //playerId id the matched string from regex search in page-source player.playVideo(); </code></pre> <p>Andere Aktionen über Spieler Variablen in Beziehung kann <a href="https://developers.google.com/youtube/js_api_reference#Playback_controls" rel="nofollow">here</a> gefunden werden.</p> </div> <div class="post-info"> <div class="post-meta row"> <p class="text-secondary col-lg-6"> <span class="source"> <a rel="noopener" target="_blank" href="https://stackoverflow.com/q/35481536">Quelle</a> </span> </p> <p class="text-secondary col-lg-6"> <span class="float-right date"> <span>2016-02-18 12:29:45</span> <a rel="noopener" target="_blank" href="https://stackoverflow.com/users/3307643/">shyam</a></span> </p> <p class="col-12"></p> <p class="col-12"></p></div> </div> </div> </article> <div> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-6208739752673518" data-ad-slot="4319274062" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> </div> <div class="clearfix"> </div> <div class="relative-box"> <div class="relative">Verwandte Themen</div> <ul class="relative_list"> <li> 1. <a href="http://de.voidcc.com/question/p-ccxeygad-dx.html" target="_blank" title="Youtube - benutzerdefinierte Wiedergabe-Symbol"> Youtube - benutzerdefinierte Wiedergabe-Symbol </a> </li> <li> 2. <a href="http://de.voidcc.com/question/p-gaddyokh-en.html" target="_blank" title="Benutzerdefinierte Listenansicht mit Youtube-Video in Android"> Benutzerdefinierte Listenansicht mit Youtube-Video in Android </a> </li> <li> 3. <a href="http://de.voidcc.com/question/p-wloiordh-ee.html" target="_blank" title="YouTube-Regex-Ersatz C# -Bruch HTML"> YouTube-Regex-Ersatz C# -Bruch HTML </a> </li> <li> 4. <a href="http://de.voidcc.com/question/p-zlxdmeyt-cm.html" target="_blank" title="Django: Youtube-URL in HTML-Code umwandeln"> Django: Youtube-URL in HTML-Code umwandeln </a> </li> <li> 5. <a href="http://de.voidcc.com/question/p-ucminbuu-cv.html" target="_blank" title="HTML CSS - benutzerdefinierte Schriftarten"> HTML CSS - benutzerdefinierte Schriftarten </a> </li> <li> 6. <a href="http://de.voidcc.com/question/p-evokugez-eo.html" target="_blank" title="Benutzerdefinierte HTML - Rally TreeGrid"> Benutzerdefinierte HTML - Rally TreeGrid </a> </li> <li> 7. <a href="http://de.voidcc.com/question/p-mnuzlkjn-cn.html" target="_blank" title="Benutzerdefinierte HTML-DOM-Elemente HTML-Validierung"> Benutzerdefinierte HTML-DOM-Elemente HTML-Validierung </a> </li> <li> 8. <a href="http://de.voidcc.com/question/p-ayfhojqz-ee.html" target="_blank" title="Angular2 roh html benutzerdefinierte Attribut"> Angular2 roh html benutzerdefinierte Attribut </a> </li> <li> 9. <a href="http://de.voidcc.com/question/p-hgnwbpjl-bp.html" target="_blank" title="benutzerdefinierte HTML-Helfer, der DataAnnotations"> benutzerdefinierte HTML-Helfer, der DataAnnotations </a> </li> <li> 10. <a href="http://de.voidcc.com/question/p-wznoxkom-do.html" target="_blank" title="HTML-Eingabefeld benutzerdefinierte Schritt Tasten"> HTML-Eingabefeld benutzerdefinierte Schritt Tasten </a> </li> <li> 11. <a href="http://de.voidcc.com/question/p-clrwtaka-y.html" target="_blank" title="Attribut hinzufügen benutzerdefinierte HTML-Tags"> Attribut hinzufügen benutzerdefinierte HTML-Tags </a> </li> <li> 12. <a href="http://de.voidcc.com/question/p-kqsnyqnk-eq.html" target="_blank" title="Wie kann umleiten auf meiner HTML-Website Youtube Video einbetten, um in Youtube-Anwendung zu öffnen"> Wie kann umleiten auf meiner HTML-Website Youtube Video einbetten, um in Youtube-Anwendung zu öffnen </a> </li> <li> 13. <a href="http://de.voidcc.com/question/p-ddccdlwd-bk.html" target="_blank" title="Spielen YouTube-Video mit Start- und Endzeit mit YouTube API"> Spielen YouTube-Video mit Start- und Endzeit mit YouTube API </a> </li> <li> 14. <a href="http://de.voidcc.com/question/p-slzsljmp-v.html" target="_blank" title="iOS 8 Eingebettete YouTube in HTML-Webanwendung schlägt fehl"> iOS 8 Eingebettete YouTube in HTML-Webanwendung schlägt fehl </a> </li> <li> 15. <a href="http://de.voidcc.com/question/p-txedbsxw-cc.html" target="_blank" title="Python regex konvertieren youtube url zu youtube video"> Python regex konvertieren youtube url zu youtube video </a> </li> <li> 16. <a href="http://de.voidcc.com/question/p-raiwvqnq-bh.html" target="_blank" title="YouTube API - nicht 'onYouTubePlayerReady()'"> YouTube API - nicht 'onYouTubePlayerReady()' </a> </li> <li> 17. <a href="http://de.voidcc.com/question/p-hteptzka-dg.html" target="_blank" title="Einbetten von Youtube-Videos mit Youtube-API (Code funktioniert nicht)"> Einbetten von Youtube-Videos mit Youtube-API (Code funktioniert nicht) </a> </li> <li> 18. <a href="http://de.voidcc.com/question/p-ojwhtxgm-h.html" target="_blank" title="benutzerdefinierte HTML-Helfer in MVC 4"> benutzerdefinierte HTML-Helfer in MVC 4 </a> </li> <li> 19. <a href="http://de.voidcc.com/question/p-mkxlvhny-o.html" target="_blank" title="Benutzerdefinierte HTTP-Anfrage-Header in HTML"> Benutzerdefinierte HTTP-Anfrage-Header in HTML </a> </li> <li> 20. <a href="http://de.voidcc.com/question/p-zibkvbmp-z.html" target="_blank" title="Selectize.js benutzerdefinierte Rendering mit statischen HTML"> Selectize.js benutzerdefinierte Rendering mit statischen HTML </a> </li> <li> 21. <a href="http://de.voidcc.com/question/p-anjejyqt-do.html" target="_blank" title="jtidy recht drucken Sie benutzerdefinierte HTML-Tag"> jtidy recht drucken Sie benutzerdefinierte HTML-Tag </a> </li> <li> 22. <a href="http://de.voidcc.com/question/p-oiieyeyt-d.html" target="_blank" title="Benutzerdefinierte Eingabe HTML mit CakePHP's FormHelper"> Benutzerdefinierte Eingabe HTML mit CakePHP's FormHelper </a> </li> <li> 23. <a href="http://de.voidcc.com/question/p-wtkpvbdv-g.html" target="_blank" title="Benutzerdefinierte Anmeldung mit htaccess durch HTML/PHP"> Benutzerdefinierte Anmeldung mit htaccess durch HTML/PHP </a> </li> <li> 24. <a href="http://de.voidcc.com/question/p-qznhteeo-o.html" target="_blank" title="Rails - Benutzerdefinierte html in simple_form label"> Rails - Benutzerdefinierte html in simple_form label </a> </li> <li> 25. <a href="http://de.voidcc.com/question/p-bmqpgtid-cq.html" target="_blank" title="ASP.NET MVC 5 - Benutzerdefinierte HTML-Steuerelemente"> ASP.NET MVC 5 - Benutzerdefinierte HTML-Steuerelemente </a> </li> <li> 26. <a href="http://de.voidcc.com/question/p-spwffdkb-bo.html" target="_blank" title="Benutzerdefinierte Bildlaufleiste Visualisierung mit HTML/CSS/JavaScript"> Benutzerdefinierte Bildlaufleiste Visualisierung mit HTML/CSS/JavaScript </a> </li> <li> 27. <a href="http://de.voidcc.com/question/p-hhhumtsg-cx.html" target="_blank" title="HTML lädt keine vollständige benutzerdefinierte Schriftart"> HTML lädt keine vollständige benutzerdefinierte Schriftart </a> </li> <li> 28. <a href="http://de.voidcc.com/question/p-skayyifp-bt.html" target="_blank" title="Benutzerdefinierte HTML-Attribute in MVC3 Modell"> Benutzerdefinierte HTML-Attribute in MVC3 Modell </a> </li> <li> 29. <a href="http://de.voidcc.com/question/p-mtemwpjw-bp.html" target="_blank" title="zend form, wie viele benutzerdefinierte html"> zend form, wie viele benutzerdefinierte html </a> </li> <li> 30. <a href="http://de.voidcc.com/question/p-wqzkwxwy-ba.html" target="_blank" title="Benutzerdefinierte CSS-Eigenschaften oder HTML-Attribute?"> Benutzerdefinierte CSS-Eigenschaften oder HTML-Attribute? </a> </li> </ul> </div> <div> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-6208739752673518" data-ad-slot="3534119089"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <div class="padding-top-10"></div> </div> </div> <script type="text/javascript" src="http://img2.voidcc.com/voidso/script/side.js?t=1652515422091"></script> <script type="text/javascript" src="http://img2.voidcc.com/voidso/plugin/highlight/highlight.pack.js"></script> <link href="http://img2.voidcc.com/voidso/plugin/highlight/styles/docco.css" media="screen" rel="stylesheet" type="text/css" /> <script type="text/javascript"> $('pre').each(function(i, e) { hljs.highlightBlock(e, "<span class='indent'> </span>", false) }); </script> <div class="col-lg-3 col-md-4 col-sm-5"> <div id="rightTop"> <div class="row"> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>  <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-6208739752673518" data-ad-slot="3862022848" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <div class="row sidebar panel panel-default"> <div class="panel-heading font-bold"> Letzte Frage </div> <div class="m-b-sm m-t-sm clearfix"> <ul class="side_article_list"> <li class="side_article_list_item"> 1. <a href="http://de.voidcc.com/question/p-pubojyiv-ne.html" target="_blank" title="Korrekte Syntax der Argumentliste für Module className und css mit BEM"> Korrekte Syntax der Argumentliste für Module className und css mit BEM </a> </li> <li class="side_article_list_item"> 2. <a href="http://de.voidcc.com/question/p-gsraxgqp-na.html" target="_blank" title="Automatisches Vergrößern der Seite auf maximale oder bestimmte% wenn geladen?"> Automatisches Vergrößern der Seite auf maximale oder bestimmte% wenn geladen? </a> </li> <li class="side_article_list_item"> 3. <a href="http://de.voidcc.com/question/p-wajiaqii-nc.html" target="_blank" title="Prestashop Wagen nicht retten Arbeits"> Prestashop Wagen nicht retten Arbeits </a> </li> <li class="side_article_list_item"> 4. <a href="http://de.voidcc.com/question/p-quuuujwl-my.html" target="_blank" title="Pygame Maus halten"> Pygame Maus halten </a> </li> <li class="side_article_list_item"> 5. <a href="http://de.voidcc.com/question/p-zakczpgw-na.html" target="_blank" title="Ist es möglich, eine Header-Datei zu zentrieren Text zu machen? - In Console"> Ist es möglich, eine Header-Datei zu zentrieren Text zu machen? - In Console </a> </li> <li class="side_article_list_item"> 6. <a href="http://de.voidcc.com/question/p-ddwhjuwq-nd.html" target="_blank" title="So ändern Sie die App-ID in buildfire.js"> So ändern Sie die App-ID in buildfire.js </a> </li> <li class="side_article_list_item"> 7. <a href="http://de.voidcc.com/question/p-onuzrzpe-ne.html" target="_blank" title="Kann nicht das erste Kind wählen in css"> Kann nicht das erste Kind wählen in css </a> </li> <li class="side_article_list_item"> 8. <a href="http://de.voidcc.com/question/p-mypgdtvt-nb.html" target="_blank" title="Angular Service Worker auf den Browsern, die es nicht unterstützen"> Angular Service Worker auf den Browsern, die es nicht unterstützen </a> </li> <li class="side_article_list_item"> 9. <a href="http://de.voidcc.com/question/p-yrpwrakb-nd.html" target="_blank" title="'WordPress' Transliteration von Permalinks auf einer Website verfügbar, aber nicht auf der zweiten"> 'WordPress' Transliteration von Permalinks auf einer Website verfügbar, aber nicht auf der zweiten </a> </li> <li class="side_article_list_item"> 10. <a href="http://de.voidcc.com/question/p-ovrdnveu-mz.html" target="_blank" title="Modul installiert aber kann nicht importiert werden"> Modul installiert aber kann nicht importiert werden </a> </li> </ul> </div> </div> </div> <p class="article-nav-bar"></p> <div class="row sidebar article-nav"> <div class="row box_white visible-sm visible-md visible-lg margin-zero"> <div class="top"> <h3 class="title"><i class="glyphicon glyphicon-th-list"></i> Verwandte Themen</h3> </div> <div class="article-relative-content"> <ul class="side_article_list"> <li class="side_article_list_item"> 1. <a href="http://de.voidcc.com/question/p-ccxeygad-dx.html" target="_blank" title="Youtube - benutzerdefinierte Wiedergabe-Symbol"> Youtube - benutzerdefinierte Wiedergabe-Symbol </a> </li> <li class="side_article_list_item"> 2. <a href="http://de.voidcc.com/question/p-gaddyokh-en.html" target="_blank" title="Benutzerdefinierte Listenansicht mit Youtube-Video in Android"> Benutzerdefinierte Listenansicht mit Youtube-Video in Android </a> </li> <li class="side_article_list_item"> 3. <a href="http://de.voidcc.com/question/p-wloiordh-ee.html" target="_blank" title="YouTube-Regex-Ersatz C# -Bruch HTML"> YouTube-Regex-Ersatz C# -Bruch HTML </a> </li> <li class="side_article_list_item"> 4. <a href="http://de.voidcc.com/question/p-zlxdmeyt-cm.html" target="_blank" title="Django: Youtube-URL in HTML-Code umwandeln"> Django: Youtube-URL in HTML-Code umwandeln </a> </li> <li class="side_article_list_item"> 5. <a href="http://de.voidcc.com/question/p-ucminbuu-cv.html" target="_blank" title="HTML CSS - benutzerdefinierte Schriftarten"> HTML CSS - benutzerdefinierte Schriftarten </a> </li> <li class="side_article_list_item"> 6. <a href="http://de.voidcc.com/question/p-evokugez-eo.html" target="_blank" title="Benutzerdefinierte HTML - Rally TreeGrid"> Benutzerdefinierte HTML - Rally TreeGrid </a> </li> <li class="side_article_list_item"> 7. <a href="http://de.voidcc.com/question/p-mnuzlkjn-cn.html" target="_blank" title="Benutzerdefinierte HTML-DOM-Elemente HTML-Validierung"> Benutzerdefinierte HTML-DOM-Elemente HTML-Validierung </a> </li> <li class="side_article_list_item"> 8. <a href="http://de.voidcc.com/question/p-ayfhojqz-ee.html" target="_blank" title="Angular2 roh html benutzerdefinierte Attribut"> Angular2 roh html benutzerdefinierte Attribut </a> </li> <li class="side_article_list_item"> 9. <a href="http://de.voidcc.com/question/p-hgnwbpjl-bp.html" target="_blank" title="benutzerdefinierte HTML-Helfer, der DataAnnotations"> benutzerdefinierte HTML-Helfer, der DataAnnotations </a> </li> <li class="side_article_list_item"> 10. <a href="http://de.voidcc.com/question/p-wznoxkom-do.html" target="_blank" title="HTML-Eingabefeld benutzerdefinierte Schritt Tasten"> HTML-Eingabefeld benutzerdefinierte Schritt Tasten </a> </li> </ul> </div> </div> </div> </div> </div> </div> </div>  <footer id="footer"> <div class="bg-simple lt"> <div class="container"> <div class="row padder-v m-t"> <div class="col-xs-8"> <ul class="list-inline"> <li><a href="http://de.voidcc.com/contact">Sprechen Sie uns an</a></li> <li>© 2020 DE.VOIDCC.COM</li> <li><a rel="nofollow" href="https://beian.miit.gov.cn/" target="_blank">沪ICP备13005482号-13</a></li> <li><script type="text/javascript" src="https://s9.cnzz.com/z_stat.php?id=1280098168&web_id=1280098168"></script></li> <li><a href="http://cn.voidcc.com/" target="_blank" title="程序问答园区">简体中文</a></li> <li><a href="http://hk.voidcc.com/" target="_blank" title="程序問答園區">繁體中文</a></li> <li><a href="http://ru.voidcc.com/" target="_blank" title="поле вопросов и ответов">Русский</a></li> <li><a href="http://de.voidcc.com/" target="_blank" title="Frage - und - antwort - Park">Deutsch</a></li> <li><a href="http://es.voidcc.com/" target="_blank" title="Preguntas y respuestas">Español</a></li> <li><a href="http://hi.voidcc.com/" target="_blank" title="कार्यक्रम प्रश्न और उत्तर पार्क">हिन्दी</a></li> <li><a href="http://it.voidcc.com/" target="_blank" title="IL Programma di chiedere Park">Italiano</a></li> <li><a href="http://ja.voidcc.com/" target="_blank" title="プログラム問答園区">日本語</a></li> <li><a href="http://ko.voidcc.com/" target="_blank" title="프로그램 문답 단지">한국어</a></li> <li><a href="http://pl.voidcc.com/" target="_blank" title="program o park">Polski</a></li> <li><a href="http://tr.voidcc.com/" target="_blank" title="Program soru ve cevap parkı">Türkçe</a></li> <li><a href="http://vi.voidcc.com/" target="_blank" title="Đáp ứng viên">Tiếng Việt</a></li> <li><a href="http://fr.voidcc.com/" target="_blank" title="Programme interrogation Park">Française</a></li> </ul> </div> </div> </div> </div> </div> </footer>  <script async src="https://www.googletagmanager.com/gtag/js?id=UA-77509369-5"></script> <script> window.dataLayer = window.dataLayer || []; function gtag() { dataLayer.push(arguments); } gtag('js', new Date()); gtag('config', 'UA-77509369-5'); </script> <script> var _hmt = _hmt || []; (function () { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?67d4731349f0b00136755b80364ce381"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> </body> </html>