Versuchen, einen Twitch-Player ein-/auszuschalten mit JavaScript in HTML

Also versuche ich etwas HTML5 Zeug für die Erstellung meiner eigenen Website von Grund auf neu zu lernen. Eine Sache, die ich ausprobieren wollte, war Twitch Chat und Player auf der Webseite zu setzen. Iwant es die Seite mit dem Spieler abwesend zu starten und die Tasten verfügbar, um den Player + Chat ein- oder auszuschalten. Ich habe versucht, meinen Kopf darum zu wickeln und ich kann nicht die Lösung finden, nach der ich suche. Ich würde mich über Tipps und Hinweise freuen, danke! Versuchen, einen Twitch-Player ein-/auszuschalten mit JavaScript in HTML

<a href=" javascript:player()">Display/Hide Player</a> 
<a href=" javascript:chat()">Display/Hide Chat</a> 

<script> 

var playeron = false; 
function player() 
{ 
    if(playeron==false) 
    { 
     playeron=true; 
     document.getElementById("MyPlayer").style.display="block"; 
    } 
    else 
    { 
     playeron=false; 
     document.getElementById("MyPlayer").style.display="none"; 
    } 
} 

var chaton=false; 
function chat() 
{ 
    if(chaton==false) 
    { 
     chaton=true; 
     document.getElementById("MyChat").style.display="block"; 
    } 
    else 
    { 
     chaton=false; 
     document.getElementById("MyChat").style.display="none"; 
    } 
} 
</script> 

<iframe id = "MyPlayer" src="https://player.twitch.tv/?volume=0.32&channel=blackdahlia1147" width="1280" height="720"></iframe> 

<iframe id = "MyChat" src="https://www.twitch.tv/blackdahlia1147/chat?popout=" width="300" height="720"></iframe>

Quelle

2016-07-20 Black Dahlia1147

<script> 
var playeron=false; 
var chaton=false; 
function player(){ 
if(playeron==false){ 
playeron=true; 
document.getElementById("MyPlayer").style.display="block"; 
}else{ 
playeron=false; 
document.getElementById("MyPlayer").style.display="none"; 
} 
} 
//try it yourself for chat 
</script> 




<a href=" javascript:player()">Display/Hide player</a> 
<a href=" javascript:chat()">Display/Hide Chat</a> 
<style> 
iframe{ 
display:none; 
} 
</style>

Quelle

2016-07-20 01:07:45

Hm, das gibt mir die vier Schaltflächen zum Anzeigen oder Verbergen der beiden Komponenten, aber sie tun eigentlich nichts. Ich bin mir nicht sicher, was die if-Anweisung für "status == false" macht und wie die if-Anweisung für "toggle == 'p'" funktioniert. Ich denke, es könnte zu einer einzigen if/else-Anweisung für den Spieler und einer anderen für den Chat vereinfacht werden, obwohl ich mir nicht sicher bin, wie diese Variablen zur Zeit funktionieren. –

Ok ich bin nicht neben einem Computer, druckt der Browser irgendwelche Fehler? –

Keine Fehler Ich verwende Chrome mit einer lokalen HTML-Textdatei auf meinem Computer. Es zeigt die vier Tasten an, mit denen Sie den Player/Chat ein- oder ausgeschaltet haben, sie tun nichts, wenn Sie darauf klicken. Wenn möglich, bevorzuge ich auch eine Umschalttaste, die nur Player an/aus ist und chat on/off, aber die Art funktioniert in diesem Stumpf ich verstehe nicht, wie etwas in die Funktionen –

-1

Ich lief den Code und ich fand, dass Ihr versucht, in einer sonst wenn Schleifenvariablen mit Links zu verwenden. Nun, was ich sage, ist, dass Sie eine Option für eine zu durchsuchende Schleife erstellt haben, was gut ist, wenn Sie mehrere Kanäle erstellen möchten, die ein Benutzer durchsuchen kann.

sonst { player = "https://player.twitch.tv/?volume=0.32&channel=blackdahlia1147" chat = "https://www.twitch.tv/blackdahlia1147/chat?popout=" }

, was Sie zuerst tun müssen, ist lernen, ein "Plugin" in Ihren HTML hinzufügen, wenn Sie nur diese beiden Kanäle wollen. Ihr "Player" und "Chat" sind Links zu einer Website, ein "Plugin" ist das, wonach Sie suchen. Zum youtube und geben Sie „Plugin“, wenn Sie Ihre „Plugin“ erhalten dann schreiben:

<iframe src="plugin"></iframe>

Sie wirklich brauchen nicht die js an dieser Stelle.

"Onclick" ist, was Sie auch suchen. Gehe zu w3school.com und sie haben tolle Optionen für Schaltflächen und Animationsoptionen.

Quelle

2016-07-20 01:09:43

macht keinen Sinn. Bitte markieren Sie den Inline-Code, indem Sie beim Start vier Leerzeichen hinzufügen. Benutze die offizielle Sprache, nicht so etwas wie "pluggin" –

Sie verpasst eine öffnende Klammer nach function twitch(toggle)

Quelle

2016-07-20 01:18:31 ahhmarr

<a href="javascript:toggle('MyPlayer')">Display/Hide Player</a> 
<a href="javascript:toggle('MyChat')">Display/Hide Chat</a> 
<iframe id="MyPlayer" src="https://player.twitch.tv/?volume=0.32&channel=blackdahlia1147" width="1280" height="720" style="display: block;"></iframe> 
<iframe id="MyChat" src="https://www.twitch.tv/blackdahlia1147/chat?popout=" width="300" height="720" style="display: block;"></iframe> 

<script> 
    function toggle(id) { 
    var elem = document.getElementById(id); 
    if (elem.style.display != 'none') { 
     elem.style.display = 'none'; 
    } else { 
     elem.style.display = 'block'; 
    } 
    } 
</script>

wird diese Arbeit für Sie, mit dem Vorteil der Flexibilität, wenn Sie mehr Dinge machen wollen zu/Anzeige auszublenden.

Quelle

2016-07-21 21:33:18 Skhmt

Danke :) Ich werde es mir ansehen, wenn ich wieder nach Hause komme! –

Versuchen, einen Twitch-Player ein-/auszuschalten mit JavaScript in HTML

Antwort

Verwandte Themen