Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag03.01.2016 um 10:19 (UTC)    
Titel: Wie kann ich ein Foto mit Hintergrundmusik belegen?

Ich würde gerne ein einzelnes Foto mit Hintergrundmusik belegen und nicht meine ganze Seite.
Beitrag04.01.2016 um 08:27 (UTC)    
Titel:

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
---
Ist ein Thema von dir erledigt, dann schreib das [erledigt] doch BITTE auch in den Titel des ersten Postings rein!
Verwendet sinnvolle und beschreibende Titel. Wer kann mir helfen ... oder Hilfe... sind nur bedingt hilfreich!
Doppelpostings quer durchs Forum finden übrigens nicht nur Moderatoren doof!
Themenfremde Posting in den verschiedenen Kategorien sind ebenso doof und schaffen nur unnötige Arbeit!
Beitrag04.01.2016 um 11:41 (UTC)    
Titel:

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?
______________
Mit mir chatten? Besuche uns auf CookieChat.de (keine Anmeldung nötig, einfach einen Spitznamen einegeben)
Beitrag29.01.2016 um 22:54 (UTC)    
Titel:

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.
Beitrag30.01.2016 um 01:21 (UTC)    
Titel: Re: Wie kann ich ein Foto mit Hintergrundmusik belegen?

Summit-Analog hat Folgendes geschrieben:
Ich würde gerne ein einzelnes Foto mit Hintergrundmusik belegen und nicht meine ganze Seite.


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.. Wink
Beitrag27.03.2016 um 10:11 (UTC)    
Titel: Bild mit Hintergrund

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. Wink

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.
______________
Alles über 3D-Druck | Heimsteuerung mit Rapberry PI | Kontakt - über mich
FAQ YOU!!! - Ich biete keinen Support über PN an!!! - bitte schreibt im Forum
Homepage-Tools: HTML-Grundkurs | Farbtabelle | Mi† Soиdεrzeichen schreiЬen
CSS-Tuturials: CSS-Grundkurs | Transparente Elemente | Farbverläufe | Boxschatten | CSS-Rahmen | Textschatten | Hintergrundbilder
Javascript-Tuturials


Zuletzt bearbeitet von schreibmalwas am 27.03.2016, 11:24, insgesamt einmal bearbeitet
Beitrag29.03.2016 um 07:26 (UTC)    
Titel:

Und wenn du dem User das ganze noch mit Code Beispielen belegt hättest, dann wäre es sicherlich hilfreicher Wink
______________
mfg SEO
---
Ist ein Thema von dir erledigt, dann schreib das [erledigt] doch BITTE auch in den Titel des ersten Postings rein!
Verwendet sinnvolle und beschreibende Titel. Wer kann mir helfen ... oder Hilfe... sind nur bedingt hilfreich!
Doppelpostings quer durchs Forum finden übrigens nicht nur Moderatoren doof!
Themenfremde Posting in den verschiedenen Kategorien sind ebenso doof und schaffen nur unnötige Arbeit!
Beitrag29.03.2016 um 08:13 (UTC)    
Titel: Bild mit Sound per Hover-Effekt

seo-suchmaschinenoptimierung hat Folgendes geschrieben:
Und wenn du dem User das ganze noch mit Code Beispielen belegt hättest, dann wäre es sicherlich hilfreicher

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
Zitat:
<script type="text/javascript">
function start_audio() {
var player = document.getElementById("mein_player");
player.play();
}
function pause_audio() {
var player = document.getElementById("mein_player");
player.pause();
}
</script>


HTML
Zitat:

<img onmouseover="start_audio();" onmouseout="pause_audio();" alt="Sound abspielen" title="3D-Drucker mit Hintergrundmusik" src="img.png" class="hoversound_img"><br>
<audio id="mein_player" nocontrols>
<source src="song.ogg" type="audio/ogg">
<source src="song.mp3" type="audio/mpeg">
<a href="song.mp3" target="_blank">Musik zum Bild abspielen</a><br>
</audio>
Fahren Sie mit der Maus über das Bild, um die passende Musik dazu zu hören.


CSS (Optional)
Zitat:
<style type="text/css">
.hoversound_img{
border-radius:15px;
opacity: 0.6;
filter: alpha(opacity=60); /* For IE8 and earlier */
-webkit-transition: all 1s;
-moz-transition: all 1s;
-o-transition: all 1s;
transition: all 1s;
}
.hoversound_img:hover {
border-radius:5px;
opacity: 1.0;
filter: alpha(opacity=100); /* For IE8 and earlier */
}
</style>


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. Wink

Ich habe das Beispiel hier hochgeladen:
www.goetz-veit.tk/files/hpbk/audio_hover
______________
Alles über 3D-Druck | Heimsteuerung mit Rapberry PI | Kontakt - über mich
FAQ YOU!!! - Ich biete keinen Support über PN an!!! - bitte schreibt im Forum
Homepage-Tools: HTML-Grundkurs | Farbtabelle | Mi† Soиdεrzeichen schreiЬen
CSS-Tuturials: CSS-Grundkurs | Transparente Elemente | Farbverläufe | Boxschatten | CSS-Rahmen | Textschatten | Hintergrundbilder
Javascript-Tuturials


Zuletzt bearbeitet von schreibmalwas am 29.03.2016, 10:51, insgesamt 3-mal bearbeitet
Beitrag01.06.2016 um 10:34 (UTC)    
Titel:

Danke für die Tipps!
Beitrag08.06.2016 um 12:54 (UTC)    
Titel:

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.
Beitrag08.07.2016 um 12:23 (UTC)    
Titel:

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



Zuletzt bearbeitet von 6p-iceblue am 08.07.2016, 13:54, insgesamt 4-mal bearbeitet
Beitrag22.07.2016 um 10:43 (UTC)    
Titel:

blumenmania hat Folgendes geschrieben:
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.


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

Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de