Methode zur Implementierung von Website-Hintergrundmusik

Methode zur Implementierung von Website-Hintergrundmusik
Für einzelne Webmaster war es schon immer das Ziel unermüdlicher Anstrengungen, ihre Website einzigartig und voller Persönlichkeit zu gestalten. Wenn Sie beim Öffnen der Webseite nicht nur die visuellen Effekte und interaktiven Funktionen der Seite so weit wie möglich verbessern, glaube ich, dass es Ihrer Website viel Farbe verleihen wird, wenn Sie beim Öffnen der Webseite eine schöne und bewegende Musik hören.

1. Erfahren Sie, wie Sie Musikdateien hinzufügen

Es gibt grundsätzlich zwei Möglichkeiten, einer Webseite Hintergrundmusik hinzuzufügen. Die erste besteht darin, sie über das normale <bgsound>-Tag hinzuzufügen, die andere darin, sie über das <embed>-Tag hinzuzufügen.

1. Verwenden des <bgsound>-Tags

Öffnen Sie mit Dreamweaver die Seite, auf der Sie Hintergrundmusik hinzufügen möchten, klicken Sie auf „Code“, um die Codebearbeitungsansicht zu öffnen, geben Sie „<“ zwischen <body></body> ein und wählen Sie im Popup-Code-Eingabeaufforderungsfeld bgsound aus (Abbildung 1).


Dreamweaver gibt automatisch den Code „<bgsound“ ein und drückt dann die Leertaste. Das Code-Eingabeaufforderungsfeld listet automatisch die Attribute des bgsound-Tags auf, aus denen Sie auswählen können. Das bgsound-Tag hat fünf Attribute, darunter „balance“, das zum Einstellen der Links- und Rechtsbalance der Musik verwendet wird, „delay“, das zum Einstellen der Wiedergabeverzögerung verwendet wird, „loop“, das zum Steuern der Anzahl der Schleifen verwendet wird, „src“ der Pfad unserer Musikdatei ist und „volume“, das zum Einstellen der Lautstärke verwendet wird. Wenn wir Hintergrundmusik hinzufügen, müssen wir im Allgemeinen weder die Links-/Rechts-Balance noch die Verzögerung für die Musik einstellen, sodass nur einige Hauptparameter erforderlich sind. Der endgültige Code lautet wie folgt:

<bgsound src="musik.mid" loop="-1">

Unter ihnen bedeutet loop="-1", dass die Musik in einer Endlosschleife abgespielt wird. Wenn Sie die Häufigkeit festlegen möchten, mit der die Musik abgespielt wird, ändern Sie sie einfach in die entsprechende Zahl.

Diese Methode zum Hinzufügen von Hintergrundmusik ist die einfachste und am häufigsten verwendete Methode. Das Hintergrundmusikformat unterstützt die meisten aktuellen Mainstream-Musikformate wie WAV, MID, MP3 usw. Wenn Sie Zuschauer mit niedrigeren Internetgeschwindigkeiten berücksichtigen möchten, können Sie MID-Soundeffekte als Hintergrundmusik für die Webseite verwenden. Da MID-Musikdateien klein sind, können sie beim Öffnen der Webseite schnell geladen und abgespielt werden. MID hat jedoch auch seine Nachteile. Es kann nur die Melodie der Musik speichern, verfügt aber nicht über schöne Harmonien oder Texte. Falls Ihre Internetgeschwindigkeit hoch ist oder Sie die MID-Musik ein wenig eintönig finden, können Sie auch MP3-Musik hinzufügen. Ändern Sie einfach happy.mid im obigen Code in happy.mp3.

Tipp: Das Hinzufügen von Hintergrundmusik ist in FrontPage relativ einfacher als in Dreamweaver. Nehmen Sie einfach die entsprechenden Einstellungen im Dialogfeld „Hintergrund“ vor (Abbildung 2).


(ii) Verwenden des <embed>-Tags

Die Verwendung des <embed>-Tags zum Hinzufügen von Musik ist keine sehr gebräuchliche Methode, aber sie ist sehr leistungsfähig. In Kombination mit einigen Wiedergabesteuerungen können Sie einen Webplayer erstellen.

Die Verwendung ist grundsätzlich die gleiche wie bei der ersten Methode, mit dem Unterschied, dass Sie im ersten Schritt im Code-Eingabeaufforderungsfeld nicht gbsound, sondern stattdessen „embed“ auswählen. Wählen Sie dann dessen Eigenschaften aus und legen Sie sie entsprechend fest (Abbildung 3). Wie aus der Abbildung ersichtlich ist, umfasst die Eigenschaften von embed viel mehr als die fünf Eigenschaften von gbsound. Der endgültige Code lautet wie folgt: <embed src="music.mp3" autostart="true" loop="true" hidden="true"></embed>.

Unter anderem wird mit „Autostart“ eingestellt, ob die Musik beim Öffnen der Seite automatisch abgespielt wird, und mit „Hidden“ wird eingestellt, ob der Media Player ausgeblendet werden soll. Denn Embed ist eigentlich wie ein Musikplayer auf einer Webseite; wenn es nicht versteckt ist, wird das Standard-Medien-Plug-In Ihres Systems angezeigt.

Für diese beiden Methoden gilt, dass jede ihrer Vor- und Nachteile hat: Bei der ersten Methode wird die Musik abgespielt, wenn die Seite geöffnet wird. Wird die Seite minimiert, pausiert die Musik automatisch. Bei der zweiten Methode passiert das nicht. Solange das Fenster nicht geschlossen wird, wird die Musik weiter abgespielt. Daher hoffe ich, dass jeder die Methode zum Hinzufügen von Musik entsprechend seiner eigenen Situation während der Verwendung auswählt.

Nachdem Sie die einfache Methode zum Hinzufügen von Musik zum Web kennengelernt haben, sollten Sie an der Benutzeroberfläche und den Funktionen arbeiten. Mit „Web Music Player“ können wir einen eleganten Musik-Player erstellen.

2. Erstellen Sie einen stilvollen Musik-Player

Nachdem Sie die einfache Methode zum Hinzufügen von Musik zum Web kennengelernt haben, sollten Sie an der Benutzeroberfläche und den Funktionen arbeiten. Mit „Web Music Player“ können wir einen eleganten Musik-Player erstellen.

Tipp: „Web Music Player“ ist ein Webseiten-Plugin. Nach dem Ausführen der erstellten Seite wird der im System integrierte Windows Media Player aufgerufen, um die voreingestellten MP3-Songs abzuspielen.

1. Einfache Einstellungen

Laden Sie zunächst das Wiedergabe-Plugin herunter (Download-Adresse: https://www.jb51.net/jiaoben/32793.html), entpacken Sie es und geben Sie das Verzeichnis ein. Music.htm ist die Wiedergabeleistenseite, die wir auf der Homepage laden möchten, list.htm ist die Popup-Seite, auf der die Zuschauer die Wiedergabeliste anzeigen können, der Ordner js enthält mehrere Wiedergabesteuerungsdateien und img enthält einige Bilddateien der Wiedergabeoberfläche.

Öffnen Sie music.htm mithilfe einer Web-Bearbeitungssoftware und suchen Sie den folgenden Code:

<script Language="Javascript">
var blnAutoStart = true?
var blnRndPlay = false?
var blnStatusBar = false?
var blnShowVolCtrl = true?
var blnShowPlist = true?
var blnUseSmi = false?
var blnLoopTrk = true?
var blnShowMmInfo =false?
</Skript>

Hier können Sie grundlegende Einstellungen für den Player vornehmen. Die obigen Sätze bedeuten: ob automatisch abgespielt werden soll, ob sequenziell abgespielt werden soll, ob die Statusleiste angezeigt werden soll, ob der Status der Tonsteuerung angezeigt werden soll, ob die Anzeige der Wiedergabeliste zugelassen werden soll, ob der SMI-Modus verwendet werden soll, ob in einer Schleife abgespielt werden soll und ob Songinformationen angezeigt werden sollen. Sie können sie entsprechend Ihren Bedürfnissen einstellen, wobei „true“ „ja“ und „false“ „nein“ bedeutet. Um Ihre Wiedergabeleiste persönlicher zu gestalten, können Sie außerdem im Code von music.htm nach der Anweisung <marquee>......</marquee> suchen und den Namen der Homepage in den Namen Ihrer eigenen Homepage ändern.

(II) Eine Playlist hinzufügen

Öffnen Sie die Wiedergabelistendatei bglist.js im Ordner js und fügen Sie hier Ihre Lieblingssongs zur Liste hinzu. Das spezifische Format zum Hinzufügen ist mkList „Songpfad“? „Songbeschreibung“?, wobei „Songpfad“ die lokale Adresse sein kann, die Sie auf den Host hochgeladen haben, oder Sie können die MP3-Adresse im Netzwerk angeben und „Songbeschreibung“ wird zum Scrollen auf der Wiedergabeleiste verwendet, was der Sänger und der Name des Songs sein kann. Wenn wir beispielsweise „Tornado“ von Jay Chou hinzufügen möchten, suchen wir zuerst die Linkadresse, die in Echtzeit im Internet abgespielt werden kann, und fügen sie dann der Liste hinzu: mkList „http://202.102.43.37/hy/yinyue/周杰伦/09.mp3“? „Jay Chou – Tornado“.

Tipp: Damit die Musik auf Ihrer Homepage immer frisch bleibt, können wir die Playlist in regelmäßigen Abständen aktualisieren.

(III) Installieren des Players

Um zu verhindern, dass die Kontinuität der Songwiedergabe durch das Klicken auf den Homepage-Link beeinträchtigt wird, müssen wir die Wiedergabeseite music.htm in Form eines Frames auf der Homepage installieren.

Am Beispiel von FrontPage 2003 führen Sie „Neu → Andere Webseitenvorlagen“ aus, um das Fenster „Webseitenvorlage“ zu öffnen. Wählen Sie „Webseitenrahmen → Fußzeile“ und legen Sie nach „OK“ fest, dass die erste Webseite im oberen Rahmen auf Ihre Homepage und der untere Rahmen auf music.htm verweist. Entfernen Sie dann den Rahmenrand in den Rahmeneigenschaften und passen Sie die Höhe des unteren Rahmens entsprechend an (Abbildung 4). Die Rahmenhöhe sollte ausreichen, um die Höhe der Wiedergabeleiste aufzunehmen. Wenn Sie mit der Vorschau zufrieden sind, können Sie die Seite speichern und Ihre Website dann auf diese neue Seite verweisen.

<<:  SQL-Implementierung von LeetCode (184. Das höchste Gehalt der Abteilung)

>>:  Einführung des Code-Prüftools stylelint zum Erfahrungsaustausch

Artikel empfehlen

Verwenden von js zum Implementieren eines einfachen Lichtschaltercodes

Körperteil: <button>Licht ein-/ausschalten&...

Durchführung der lokalen Migration von Docker-Images

Ich habe vor Kurzem Docker gelernt und stoße dabe...

Zusammenfassung häufiger Probleme mit MySQL-Indizes

F1: Welche Indizes hat die Datenbank? Was sind di...

Implementierung eines Karussells mit nativem JavaScript

In diesem Artikel finden Sie den spezifischen Cod...

Erläuterung der HTML-Tags

Erläuterung der HTML-Tags 1. HTML-Tags Tag: !DOCT...

Tutorial zum Erstellen eines FTP-Servers in Ubuntu 16.04

Ubuntu 16.04 baut FTP-Server FTP installieren FTP...

Grundlegende Verwendung von Javascript-Array-Includes und -Reduces

Inhaltsverzeichnis Vorwort Array.Prototyp.enthält...

3 verschiedene Möglichkeiten zum Löschen der Optionsoptionen im Auswahltag

Methode 1 Code kopieren Der Code lautet wie folgt:...

So kapseln Sie die Tabellenkomponente von Vue Element

Beim Kapseln von Vue-Komponenten werde ich weiter...

Tipps zur Verwendung kleiner HTML-Tags

Phrasenelemente wie <em></em> können d...