Wie kann ich ein Foto mit Hintergrundmusik belegen?

Ich würde gerne ein einzelnes Foto mit Hintergrundmusik belegen und nicht meine ganze Seite.

Ich denke nicht, dass dies funktioniert.
Aber falls du / wer auch immer eine Möglichkeit findet, lasse ich mich gerne eines Besseren belehren.
______________
mfg SEO

Du hast ein Bild auf deiner Homepage und es soll Musik abgespielt werden, wenn...
... das Bild im sichtbaren Bereich ist?
... der Besucher das Bild mit der Maus berührt?
______________
- Signatur vom Mod Team angepasst -
Bitte keine Werbung für fremde Projekte

=> Das ist sehr schade. Ich habe mich hier im Forum über viele Jahre engagiert und einfach meine Signatur zu verändern zeugt von mangelnder Wertschätzung für meine Beiträge, die einzig den Nutzern des Homepage-Baukastens zugute kamen. Spätestens mit der Reduzierug auf max. 10 Unterseiten* sind die guten Zeiten des Baukastens ohnehin vorbei und die einst große Gremeinschaft im Forum hat sich längst aufgelöst. Nun bin ich hier offenbar auch nicht länger erwünscht. Bleibt mir nur lebewohl zu sagen, es waren schöne 14 Jahre und der Baukasten hat mir immer viel Spass gemacht - machts gut und eventuell trifft man sich ja doch nochmal an anderer Stelle im Internet. (07.06.2020)
* mittlerweile sogar nur noch 5

Was (theoretisch) geht ist eine Slideshow zu basteln und diese mit einer Hintergrundmusik zu belegen.

Für ein einzelnes Bild gibt es de facto (keine mir bekannte) konkrete Möglichkeit. Aber was du erreichen willst, ist definitiv über irgendwelche "Umwege" relativ leicht zu realisieren vermutlich.

Also bitte mehr Infos zu dem, was genau passieren soll.

Hey,

ich denke nicht, dass das geht. Du müsstest entweder eine Flashdatei oder ein Video daraus machen oder halt ein Foto einbinden und eine Hintergrundmusik abspielen, die aber nicht mit dem Foto verknüpft ist..

Es gibt die Möglichkeit, dass mittels Javascript im Hintergrund eine Musikdatei auf ein bestimmtes Event hin abgespielt wird. Man kann ein onmouseover oder onclick-Event zum starten und ein onmouseout-Event zum Stoppen der Musik verwenden. Die Musikdatei wird dann im Hintergrund geladen.
Die Musik kommt ja nicht aus dem Bild, sondern immer noch aus den Lautsprechern.

Man kann z. B. beim Mouseover eine I-Frame.src in die URL des Audio-Files ändern oder einen HTML5-Player mit start() und pause() kontrollieren. Letzteres ist zu bevorzugen. Das ganze lässt sich natürlich auch in Flash realisieren, doch der Flash-Player ist von vielen Nutzern aus (berechtigten) Sicherheitsbedenken deaktiviert.

Du solltest beachten, dass nicht alle Benutzer eine Maus zum Überfahren besitzen, für Touch-Geräte sollte das Onclick-Event als Fallback verwendet werden. Es sollte zudem auf der Seite darauf hingewießen werden, dass man bei dem Bild einen Sound abspielen kann, sont wissen es viele Besucher gar nicht. Viele haben ihr Gerät auch auf stumm geschalten, oder der Browser ist nicht in der Lage, Audidateien wiederzugeben. Hierfür sollte, wenn es sich um ein elementäres Objekt der Seite handeln sollte, ein Download-Link dür die Audio-Datei bereit stehen.

Als Dateiformat empfehle ich mp3. Dieses Format benötigt wenig Speicher, wird meistens unterstützt und die Qualität reicht für Webseiten auch aus.
______________
Infos und Karten zu ehemaligen Sowjetischen Orten des kalten Krieges:
Baikonur Weltraumbahnhof | Semipalatinsk Testgelände | Lop Nor Testgelände (China)

Und wenn du dem User das ganze noch mit Code Beispielen belegt hättest, dann wäre es sicherlich hilfreicher
______________
mfg SEO

Klar, das ist ja keine große Sache.

Ich habe mal einen kleinen Beispielcode geschrieben.
Der Sound startet, sobald man mit der Maus über das Bild fährt und pausiert, wenn man es wieder verlässt.

Javacript

HTML

CSS (Optional)

Erklärung:
Sound abspielen wird angezeigt, wenn das Bild nicht geladen werden kann
song.ogg ist der Pfad zur OGG audiodatei
song.mp3 ist die alternative Pfadangabe für mp3
3D-Drucker mit Hintergrundmusik wird in einem kleinen Kästchen neben der Maus angezeigt, wenn man sich auf dem Bild befindet.
Fahren Sie mit der Maus über das Bild, um die passende Musik dazu zu hören. ist der Text unter dem Bild
Musik zum Bild abspielen ist der Direktlink zur Datei, wenn der Audioplayer vom Browser nicht unterstützt wird.
start_audio(); ist eine JS-Funktion und startet die Wiedergabe
pause_audio(); ist eine JS-Funktion und pausiert die Wiedergabe[/quote]
img.png ist der Pfad zum Bild

Der CSS-Code ist für die Funktion irrelevant, aber ich finde, er peppt das Ganze noch ein Bisschen auf.

Ich habe das Beispiel hier hochgeladen:
www.goetz-veit.tk/files/hpbk/audio_hover
______________
Infos und Karten zu ehemaligen Sowjetischen Orten des kalten Krieges:
Baikonur Weltraumbahnhof | Semipalatinsk Testgelände | Lop Nor Testgelände (China)

Danke für die Tipps!

Hallo,
muss die Musik hochgeladen werden, und wenn wo auf der Seite? Oder die Musik soll extern hochgeladen werden?

Bitte um Hilfe, ich möchte zu den Bildern was erzählen, habe aber keine Vorkenntnisse.

du brauchst dafür irgendwo webspace. dort wird die datei als mp3 hinterlegt und du nutzt dann diese url. wenn du das grosse premiumpaket hier kaufst, hast du dann die möglichkeit zum speichern deiner gesprochenen texte.

eine andere möglichkeit wäre youtube. dazu benötigst du dann den kostenlosen moviemaker von windows. du nimmst dann ein bild einer pflanze und fügst es im moviemaker ein. länge der zeit des bildes eingeben und besprechen. speichern als wmv und bei youtube hochladen. dort die teilen-funktion anklicken und einbetten. dann erhälst du die url des video-codes.

dieser code wird im editor einer seite eingefügt.

so würde es dann aussehen: http://gringo-gaming.de.tl/Ansichtssache.htm

übrigens: um videos bei youtube hoch zu laden, benötigst du ein google-konto. ist ebenfalls kostenlos.

Es gibt auch gemafreie musik, die du bei youtube dann runterlädst und im youtubevideo einbauen kannst.

woher bekommt man den moviemaker ab windows 7? hier im zweiten video die lösung:

http://gringo-gaming.de.tl/Tipps.htm

dazu gibt es noch tips, die dir dann schreiben werde wenn du es so machst.

gruss gringo
______________
Mein Youtube Kanal | Standard-Designs als Red Design ohne rechte Boxen | Tips zum Design Professionell

14 tage sind nach meiner antwort vergangen, und noch immer keine rückmeldung. warum schreibt man hier, wenn die eventuelle lösung gar nicht interessiert? nächstes mal überlege ich, ob man dir weiter helfen sollte.

gruss gringo
______________
Mein Youtube Kanal | Standard-Designs als Red Design ohne rechte Boxen | Tips zum Design Professionell

Danke für die Anleitung und Tipps! Hilft mir gerade sehr
LG Nina

______________
mfG design-globe