Sound im Bild

Um alle Funktionen nutzen zu k�nnen, aktivieren Sie bitte JavaScript in ihrem Browser!

Der Treffpunkt f�r Hilfe, Tricks & Tipps � XOBOR-Foren und Homepages �

Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps! � Sound im Bild

Themen-Einstellungen

Thema drucken

Bereich wechseln

Start Willkommen! Ank�ndigungen & Termine, wichtige News. Stellen Sie Ihr eigene Webseite vor. Betriebssystem MS Windows & andere Betriebssysteme Betriebssystem MS Windows 11, 10, 8 und 7 - Tricks & Tipps. MS Windows 11, 10, 8 und 7 - Fragen & Antworten. Linux, Ubuntu und andere Betriebssysteme. �rger mit dem PC, Laptop oder Tablet? �rger mit dem PC, Laptop oder Tablet - Vorbeugung und Hilfe? �rger mit dem PC, Laptop oder Tablet - Fragen & Antworten? Fragen zu DSL, VDSL, LTE und anderen Netzempfangsarten. XOBOR-Foren und Homepages Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps! Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Fragen & Antworten! Das neue Template Xobor (v6). Energieerzeugung im neuen Zeitalter - Revolution�r! Videos und Webseiten zur Freien Energie. Wasserstoff - Energietr�ger der Zukunft. Elektronik & Elektrotechnik Elektronik & Elektrotechnik - Fragen und Antworten Elektronik & Elektrotechnik - Praxis - Highlights Die besten Links! Empfehlenswerte und interessante Links! Link - Suche. Verschiedenes Faszinationen & Unglaubliches! Tricks & Tipps f�r Smartphones und iPhones. Lob, Kritik & Verbesserungsvorschl�ge. Spiel & Spa�, Witz & gute Laune! Spiritualit�t, Seele, New Age, Yoga, Gesundheit. Alles, was noch so �brig bleibt. Bannertausch Wie funktioniert der Bannertausch? Bannerrotation und Bannerwechsel.

#1 | Sound im Bild datum

23.01.2025 13:37 (zuletzt bearbeitet: 23.01.2025 13:40)

Hans58

Informationen anzeigen

Beitr�ge:	133
Registriert seit:	05.08.2008

Homepage:	Link
Letzte Spende	Betrag � Forum Spende
Sternzeichen	Nicht angegeben
Likes	57

Ich habe noch ein evtl. veraltetes Script, wahrscheinlich auch von dir aus alten Zeiten ... habe in der Suche aber nichts gefunden.

Ich habe damit das Headerbild meines Forums und mein Avatar mit einem Sound unterlegt. Als Plugin mit der entsprechenden Rechtevergabe.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
 
<audio id="MySound" src="https://files.homepagemodules.de/b135428/f199t8864p705962n2_vkMZmsKw.mp3"></audio>  
 
<script>
var Profilbild = "https://files.homepagemodules.de/b135428/f277t82465p561137n71_lLNUfECA.gif"; // Bildadresse für Soundauslösung
var Bild2 = "https://files.homepagemodules.de/b135428/f277t73545p535454n29_FYJlHhbG.jpg"; // zweite Bilddatei für Soundauslösung
var Bild3 = "https://files.homepagemodules.de/b135428/f277t73545p535454n6_JlhXEbGW.jpg"; // dritte Bilddatei für Soundauslösung
var Bild4 = "https://files.homepagemodules.de/b135428/f277t73545p535454n8_rYpWVCMQ.jpg"; // vierte Bilddatei für Soundauslösung
var Bild5 = "https://files.homepagemodules.de/b135428/f199t65501p470210n12_PiCepwAb.jpg"; // fünfte Bilddatei für Soundauslösung  
 
$('body').find('[src="'+Profilbild+'"],[src="'+Bild2+'"],[src="'+Bild3+'"],[src="'+Bild4+'"],[src="'+Bild5+'"]').on('mouseover', function () {      
    playSound();                                  //start MySound
})
.on('mouseout', function () {                    
    stopSound();                                  //stop  MySound
});
 
 
// functionen für start und stop
 
function playSound () {                           //start audio
  $('#MySound')[0].volume = 0.7;
  $('#MySound')[0].load();
  $('#MySound')[0].play();
}
function stopSound () {                           //stop audio
  $('#MySound')[0].pause();
  $('#MySound')[0].currentTime = 0;           //reset audio
}
</script>
 

Die Anzahl der Bilder lässt sich verkleinern oder vergrößern

Gibt es dafür auch Aktuelleres?

Wolfgang findet das Top!

Antworten

#2 | Update: Sound im Bild - Einfache Version Teil 1 (3) datum

28.01.2025 18:49 (zuletzt bearbeitet: 03.02.2025 15:14)

Wolfgang

Administrator

Informationen anzeigen

Beitr�ge:	3953
Registriert seit:	10.12.2006
Blog:	Wolfgangs Blog

Homepage:	Nicht angegeben
Letzte Spende	Betrag � Forum Spende
Sternzeichen	Skorpion
Likes	1806

Update: Sound im Bild - Einfache Version Teil 1 (3)

Hallo LudHabe so einiges ausprobiert, getestet und etwas gefunden!
Es wird drei Teile für das Update geben!

Was kann das neue Update in Teil 1

Da Bilder nicht nur mit dem TAG Img angezeigt werden können, sondern auch mit "Background-Image", ist es von Vorteil über die Classes und ID's den Sound beim Mouseover auszulösen zu können.
Die zugehörigen Classes und ID's lassen sich gut über "Rechte Maustaste + Untersuchen" finden!
Zusätzlich wird beim Mouseover ein kleines Lautsprechersymbol eingeblendet!
Es ist jetzt auch möglich wahlweise den Sound beim erneuten Mouseover von vorne laufen zu lassen oder ihn beim Mouseout zu pausieren (Fehler behoben, load und currentTime auskommentiert)!
Der Standort des Skriptes ist variabel, nicht mehr kritisch!
Neu! Es braucht nicht mehr die komplette Bild-Adresse eingegeben werden (z.B.: nur "avatar-b00c7f54-1.jpg")

WichtigIn der Bildergalerie, auch vereinzelnd in anderen Kategorien, sind Bilder, ohne "https" eingetragen!
Möchte man hier die Bilder mit Sound belegen, muss die Bildadresse im JavaScript unbedingt ohne "https" eingegeben werden.
Am besten die Bildadresse ohne Pfad eingeben (z.B.: "avatar-b00c7f54-1.jpg"), sonst kann die Adresse nicht richtig gelesen werden!

Installation für alle Templates

Das komplette Skript kann der Einfachheit wegen für die Template (v1-4) in die Kopf- oder Fußzeile, für das neue Xobor V6 nach Eigenes Javascript kopiert werden.

Das Skript kann auch für alle Template & Mobil als Plugin unter "Untere Leiste - Header" angelegt werden!
Wichtig! Im Plugin muss rechts oben das "Unterstützte Template" markiert werden, z.B. Business - Template (144) & Mobil - Template (177), Auswahl mit Mausklick oder Strg + Mausklick!

Durch die Zeile 12+51 ist der Standort des Skriptes unkritisch geworden, es kann in die Kopf- oder Fußzeile oder auch als Plugin installiert werden!
Über Zeile 2 wird das Lautsprechersymbol formatiert!
In Zeile 3 kann das Lautsprechersymbol speziell fürs V6 angepasst werden!
Zeile 15-20 sind für die Bild-Adressen vorgesehen, können in Verbindung mit Zeile 25, beliebig gekürzt oder erweitert werden!
In Zeile 23 können beliebige, Classes und ID's eingetragen werden. Besonders gut für Background-Images!
Mehrere Classes und ID's werden durch ein Komma getrennt!
Wird keine Class oder ID benötigt, muss "none" eingetragen werden!
Wird Zeile 39 freigegeben, startet der Sound bei einem Mouseover wieder von vorn, ansonsten pausiert er, wird beim nächsten Mouseover weitergespielt!
In Zeile 40 befindet sich die kleine Lautsprechergrafik. Ist sie nicht erwünscht, kann sie auch auskommentiert werden!

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
 
<style>
  .soundAus1 {display:none; position: absolute !important; width:20px !important; background: #dddddd; border-radius:1px; border: none !important; padding:3px; z-index:999999; box-sizing: unset; cursor:pointer;}
  .mbt .soundAus1 {width: 20px !important; }
</style>
 
<!-- Sound-Datei -->
<audio id="MySound1">
  <source src="https://files.homepagemodules.de/b135428/f199t8864p705962n2_vkMZmsKw.mp3" type="audio/mpeg">
</audio>  
 
<script>
document.addEventListener('DOMContentLoaded', function() {
 
  //Auslösung durch Bildadressen - ohne https (z.B.: "//files.homepagemodules.de/b855445/avatar-b00c7f54-1.jpg" oder "avatar-b00c7f54-1.jpg")
  var Bild1 = "//files.homepagemodules.de/b135428/f277t82465p561137n71_lLNUfECA.gif"; 
  var Bild2 = "//files.homepagemodules.de/b135428/f277t73545p535454n29_FYJlHhbG.jpg"; 
  var Bild3 = "//files.homepagemodules.de/b135428/f277t73545p535454n6_JlhXEbGW.jpg";
  var Bild4 = "//files.homepagemodules.de/b135428/f277t73545p535454n8_rYpWVCMQ.jpg";
  var Bild5 = "//files.homepagemodules.de/b135428/f199t65501p470210n12_PiCepwAb.jpg"; 
  var Bild6 = ""; 
 
  // Auslösung durch "Classes und ID's" - mehrere Classes und ID's durch Komma trennen ( z,B.: ".avatar img, .messageAvatar img, #obere_leiste .usercontent" )!
  var ClassesID = "none";  // "none" eintragen, wenn keine Classes oder ID benötigt wird!
 
  $('[src*="'+Bild1+'"], [src*="'+Bild2+'"], [src*="'+Bild3+'"], [src*="'+Bild4+'"], [src*="'+Bild5+'"], [src*="'+Bild6+'"], '+ClassesID+' ').hover(function(){ 
    $(this).prev().show();
    $(this).css('cursor','pointer');
 
    // Sound-Start    
    $('#MySound1')[0].volume = 0.7;
    $('#MySound1')[0].play();   
  }, function(){ 
    $(this).prev().hide();
 
    // Sound pausiert        
    $('#MySound1')[0].pause();
 
    // Wenn Sound immer neu gestartet werden soll
    // $('#MySound1')[0].currentTime = 0; 
  }).before('<img class="soundAus1" src="https://files.homepagemodules.de/b104774/a_389_0d1ec095.png">');
 
  // Flackern Lautsprechersymbol beheben
 $('.soundAus1').hover(function(){
    $('#MySound1')[0].play();   
    $(this).show(); 
  }, function(){
    $(this).hide();  
    $('#MySound1')[0].pause();
  });
 
});
</script>
 

Schließen

Ankündigung zum kommenden Update Teil 2Es kann auch sein, dass bei großen Bildern der Sound immer anspringt und dann den Reiz verliert und nervt!
Im 2. Teil des Updates wird es möglich sein, über das kleine Lautsprechersymbol den Sound auszuschalten!
Der Zustand wird über Session-Cookies gespeichert und hält sich solange, wie der TAB oder der Browser nicht geschlossen wird!

Bis dann und gutes Gelingen beim Testen
Wolfgang

Hans58 findet das Top!

Antworten

Moderations-Kommentar:

Beitrag nochmals überarbeitet.

#3 | Update: Sound im Bild - XL Version mit Aus- und Einschalter - Teil 2 (3) datum

03.02.2025 06:34 (zuletzt bearbeitet: 03.02.2025 15:15)

Wolfgang

Administrator

Informationen anzeigen

Beitr�ge:	3953
Registriert seit:	10.12.2006
Blog:	Wolfgangs Blog

Homepage:	Nicht angegeben
Letzte Spende	Betrag � Forum Spende
Sternzeichen	Skorpion
Likes	1806

Update: Sound im Bild - XL Version mit Aus- und Einschalter - Teil 2 (3)

Was kann das Update in Teil 2

Teil 2 hat die Eigenschaften von Teil 1.
Die Bilder können, wie gehabt, über die Classes, über die ID's oder den TAG Img angesprochen werden (siehe Teil 1).
Zusätzlich kann hier der Sound aus- und wieder eingeschaltet werden!
Der Zustand wird über Session-Cookies gespeichert.
Solange der TAB oder der Browser nicht geschlossen wird, bleibt die Abschaltung erhalten!
Auch hier braucht nicht mehr die komplette Bild-Adresse eingegeben werden (z.B.: nur "avatar-b00c7f54-1.jpg")

Installation für alle Templates

Das komplette Skript kann der Einfachheit wegen für die Template (v1-4) in die Kopf- oder Fußzeile, für das neue Xobor V6 nach Eigenes Javascript kopiert werden.

Das Skript kann auch für alle Template & Mobil als Plugin unter "Untere Leiste - Header" angelegt werden!
Wichtig! Im Plugin muss rechts oben das "Unterstützte Template" markiert werden, z.B. Business - Template (144) & Mobil - Template (177), Auswahl mit Mausklick oder Strg + Mausklick!

Durch die Zeile 11+85 ist der Standort des Skriptes unkritisch geworden, es kann in die Kopf- oder Fußzeile oder auch als Plugin installiert werden!
Über Zeile 2 wird das Lautsprechersymbol formatiert!
In Zeile 3 kann das Lautsprechersymbol speziell fürs V6 angepasst werden!
Zeile 14-19 sind für die Bild-Adressen vorgesehen, können in Verbindung mit Zeile 25, beliebig gekürzt oder erweitert werden!
In Zeile 22 können beliebige, Classes und ID's eingetragen werden. Besonders gut für Background-Images!
Mehrere Classes und ID's werden durch ein Komma getrennt!
Wird keine Class oder ID benötigt, muss "none" eingetragen werden!
Wird Zeile 38 freigegeben, startet der Sound bei einem Mouseover wieder von vorn, ansonsten pausiert er, wird beim nächsten Mouseover weitergespielt!
In Zeile 39 befindet sich die kleine Lautsprechergrafik.
Über Zeile 48-83 wird der Sound gespeichert, aus- und wieder eingeschaltet.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
 
<style>
  .soundAus3 {display:none; position: absolute !important; width:20px; background: #eeeeee; border-radius:1px; border: none !important; cursor:pointer; padding:3px; z-index:999999; box-sizing: unset;}
  .mbt .soundAus3 {width: 20px; }
</style>
 
<audio id="MySound3" class="MySound3">
  <source src="https://files.homepagemodules.de/b135428/f199t8864p705962n2_vkMZmsKw.mp3" type="audio/mpeg">
</audio>  
 
<script>
document.addEventListener('DOMContentLoaded', function() {
 
  //Auslösung durch Bildadressen - ohne https eintragen (z.B.: "//files.homepagemodules.de/b855445/avatar-b00c7f54-1.jpg")
  var Bild1 = "//files.homepagemodules.de/b135428/f277t73545p535454n6_JlhXEbGW.jpg"; 
  var Bild2 = "//files.homepagemodules.de/b135428/f277t73545p535454n6_JlhXEbGW.jpg"; 
  var Bild3 = "//files.homepagemodules.de/b135428/f277t73545p535454n6_JlhXEbGW.jpg";
  var Bild4 = "//files.homepagemodules.de/b135428/f277t73545p535454n8_rYpWVCMQ.jpg"; 
  var Bild5 = "//files.homepagemodules.de/b135428/f199t65501p470210n12_PiCepwAb.jpg";
  var Bild6 = "";
 
  // Auslösung durch "Classes und ID's" - mehrere Classes und ID's durch Komma trennen ( z,B.: ".avatar img, .messageAvatar img" )!
  var ClassesID = "none"; // "none" eintragen, wenn Classes oder ID's nicht gebraucht werden!
 
  // Hover-Funktion Sound und Lautsprechergrafik
  $('[src*="'+Bild1+'"],[src*="'+Bild2+'"],[src*="'+Bild3+'"],[src*="'+Bild4+'"],[src*="'+Bild5+'"],[src*="'+Bild6+'"],'+ClassesID+'').hover(function(){ 
    $(this).prev().show();
    
    // Sound-Start
    $('#MySound3')[0].volume = 0.5;
    $('#MySound3')[0].play();
  }, function(){ 
    $(this).prev().hide();
    
    // Sound pausiert
    $('#MySound3')[0].pause();
    
    // Wenn Sound immer neu gestart werden soll
    // $('#MySound3')[0].currentTime = 0;
  }).before('<img title="Sound mit einem Klick ausschalten" class="soundAus3" src="https://files.homepagemodules.de/b104774/a_389_0d1ec095.png">');
 
  // Flackern Lautsprechersymbol beheben
  $('.soundAus3').hover(function(){
    $(this).show(); 
  }, function(){
    $(this).hide();  
  });
  
  // Sound aus- und einschalten
  var linkstate = 0;
  $('.soundAus3').on('click',function(){
    if(linkstate === 0){ 
      linkstate = 1;
      
      // Lokalen Cookie setzen
      sessionStorage.clear();
      sessionStorage.setItem('soundHover','true');
 
      $('.MySound3').removeAttr('id');
      $('.soundAus3').attr('src','https://files.homepagemodules.de/b104774/a_390_9f889856.png').attr('title','Sound mit einen Klick einschalten');
      location.hash = '#Sound_aus';
    } else{
      linkstate = 0;
      
      // Lokalen Cookie löschen
      sessionStorage.clear();
      sessionStorage.setItem('soundHover','false');
 
      $('.MySound3').attr('id','MySound3' );
      $('.soundAus3').attr('src','https://files.homepagemodules.de/b104774/a_389_0d1ec095.png').attr('title','Sound mit einem Klick ausschalten');
      location.hash = '#Sound_an';
    }
    return false;
  });
  
  // Lokalen Cookie auslesen
  if (sessionStorage.getItem('soundHover') == 'true'){
    linkstate = 1;
    $('.MySound3').removeAttr('id');
    $('.soundAus3').attr('src','https://files.homepagemodules.de/b104774/a_390_9f889856.png').attr('title','Sound einschalten');  
    location.hash = '#Sound_aus';
  } else {
    location.hash = '#Sound_an';
  }
 
});
</script>
 

Schließen

Ankündigung zum kommenden Update Teil 3Wenn einem der Sound nicht gefällt, oder man hat ihn einfach zu oft gehört, möchte man ihn ausschalten und nicht unbedingt wieder einschalten.
Im 3. Teil des Updates wird es möglich sein, über das kleine Lautsprechersymbol den Sound fest auszuschalten!
Hier verschwindet auch das Lautsprechersymbol und wird erst wieder aktiviert, wenn der Browser-Cache gelöscht wird!

Bis dann und gutes Gelingen beim Testen
Wolfgang

Antworten

#4 | Update: Sound im Bild - XL Version mit festem Ausschalter - Teil 3 (3) datum

03.02.2025 15:05 (zuletzt bearbeitet: 03.02.2025 20:51)

Wolfgang

Administrator

Informationen anzeigen

Beitr�ge:	3953
Registriert seit:	10.12.2006
Blog:	Wolfgangs Blog

Homepage:	Nicht angegeben
Letzte Spende	Betrag � Forum Spende
Sternzeichen	Skorpion
Likes	1806

Update: Sound im Bild - XL Version mit festem Ausschalter - Teil 3 (3)

Was kann das Update in Teil 3

Teil 3 hat die Eigenschaften von Teil 1+2.
Die Bilder können, wie gehabt, über die Classes, über die ID's oder den TAG Img angesprochen werden (siehe Teil 1+2).
Der Sound kann mit dem folgenden Skript fest ausgeschaltet werden!
Der Zustand wird über Local-Cookies gespeichert.
Die Abschaltung bleibt so lange erhalten, bis der Browser-Cache gelöscht wird!
Auch hier braucht nicht mehr die komplette Bild-Adresse eingegeben werden (z.B.: nur "avatar-b00c7f54-1.jpg")

Installation für alle Templates

Das komplette Skript kann der Einfachheit wegen für die Template (v1-4) in die Kopf- oder Fußzeile, für das neue Xobor V6 nach Eigenes Javascript kopiert werden.

Das Skript kann auch für alle Template & Mobil als Plugin unter "Untere Leiste - Header" angelegt werden!
Wichtig! Im Plugin muss rechts oben das "Unterstützte Template" markiert werden, z.B. Business - Template (144) & Mobil - Template (177), Auswahl mit Mausklick oder Strg + Mausklick!

Durch die Zeile 11+71 ist der Standort des Skriptes unkritisch geworden, es kann in die Kopf- oder Fußzeile oder auch als Plugin installiert werden!
Über Zeile 2 wird das Lautsprechersymbol formatiert!
In Zeile 3 kann das Lautsprechersymbol speziell fürs V6 angepasst werden!
Zeile 14-19 sind für die Bild-Adressen vorgesehen, können in Verbindung mit Zeile 25, beliebig gekürzt oder erweitert werden!
In Zeile 22 können beliebige, Classes und ID's eingetragen werden. Besonders gut für Background-Images!
Mehrere Classes und ID's werden durch ein Komma getrennt!
Wird keine Class oder ID benötigt, muss "none" eingetragen werden!
Wird Zeile 38 freigegeben, startet der Sound bei einem Mouseover wieder von vorn, ansonsten pausiert er, wird beim nächsten Mouseover weitergespielt!
In Zeile 39 befindet sich die kleine Lautsprechergrafik.
Über Zeile 48-69 wird der Sound gespeichert, aus- und wieder eingeschaltet.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
 
<style>
  .soundAus2 {position: absolute !important; width:20px; background: #eeeeee; border-radius:1px; border: none !important; cursor:pointer; padding:3px; z-index:999999; box-sizing: unset;}
  .mbt .soundAus2 {width: 20px; }
</style>
 
<audio id="MySound2" class="MySound2">
  <source src="https://files.homepagemodules.de/b135428/f199t8864p705962n2_vkMZmsKw.mp3" type="audio/mpeg">
</audio>  
 
<script>
document.addEventListener('DOMContentLoaded', function() {
 
  //Auslösung durch Bildadressen - ohne https eintragen (z.B.: "//files.homepagemodules.de/b855445/avatar-b00c7f54-1.jpg")
  var Bild1 = "//files.homepagemodules.de/b135428/f277t73545p535454n6_JlhXEbGW.jpg"; 
  var Bild2 = "//files.homepagemodules.de/b135428/f277t73545p535454n6_JlhXEbGW.jpg"; 
  var Bild3 = "//files.homepagemodules.de/b135428/f277t73545p535454n6_JlhXEbGW.jpg";
  var Bild4 = "//files.homepagemodules.de/b135428/f277t73545p535454n8_rYpWVCMQ.jpg"; 
  var Bild5 = "//files.homepagemodules.de/b135428/f199t65501p470210n12_PiCepwAb.jpg";
  var Bild6 = "";
 
  // Auslösung durch "Classes und ID's" - mehrere Classes und ID's durch Komma trennen ( z,B.: ".avatar img, .messageAvatar img" )!
  var ClassesID = "none"; // "none" eintragen, wenn Classes oder ID's nicht gebraucht werden!
 
  // Hover-Funktion Sound und Lautsprechergrafik
  $('[src*="'+Bild1+'"],[src*="'+Bild2+'"],[src*="'+Bild3+'"],[src*="'+Bild4+'"],[src*="'+Bild5+'"],[src*="'+Bild6+'"],'+ClassesID+'').hover(function(){ 
    $(this).prev().show();
    
    // Sound-Start
    $('#MySound2')[0].volume = 0.5;
    $('#MySound2')[0].play();
  }, function(){ 
    $('.soundAus2').hide();
   
    // Sound pausiert
    $('#MySound2')[0].pause();
    
    // Wenn Sound immer neu gestart werden soll
    // $('#MySound2')[0].currentTime = 0;
  }).before('<img title="Sound mit einem Klick ausschalten" class="soundAus2" src="https://files.homepagemodules.de/b104774/a_390_9f889856.png">');
  
  // Flackern Lautsprechersymbol beheben
  $('.soundAus2').hover(function(){
    $(this).show();
  }, function(){
    $('.soundAus2').hide();
  });
  
  // Sound löschen
  function removeSound(){
    $('.MySound2, .soundAus2').remove();
    location.hash = '#Sound_aus';
  }
 
  // Sound ausschalten
  $('.soundAus2').on('click',function(){
    // Lokalen Cookie setzen
    localStorage.clear();
    localStorage.setItem('soundHover','true');
    removeSound();
    return false;
  });
  
  // Lokalen Cookie auslesen
  if (localStorage.getItem('soundHover') == 'true'){
    removeSound();
  } else {
    location.hash = '#Sound_an';
    $('.soundAus2').hide(); 
  }
 
});
</script>
 

Schließen

Bis dann und gutes Gelingen beim Testen
Wolfgang

Hans58 findet das Top!

Antworten

#5 | RE: Update: Sound im Bild - XL Version mit festem Ausschalter - Teil 3 (3) datum

03.02.2025 17:59

Super Wolfgang

Antworten

5 verschiedene Hintergrundwechsler für Forum und Homepage - Teil 1-5 � � Linklisten und Bilder im Seitenmenü

�hnliche Themen

Antworten

Letzter Beitrag

Bilder aus "Datei anhängen" + "URL-Bilder" mit einem Klick vergrößern oder modal anschauen!
Erstellt im Forum Das neue Template Xobor (v6). von Wolfgang

28.02.2026 09:10
von

Wolfgang • Zugriffe: 4733

Zu Silvester: Feuerwerk-Effekte für die Homepage mit Sound
Erstellt im Forum Das neue Template Xobor (v6). von Wolfgang 15 29.12.2024 02:41
Wolfgang • Zugriffe: 12469
"Sie haben Post" - Sound + Grafik beim Eintreffen einer Email
Erstellt im Forum Das neue Template Xobor (v6). von Wolfgang 10 23.04.2026 17:57
Dankeschön • Zugriffe: 3984

Bilder vergrößern per "Mouseover", mittels "CSS" oder "Tooltipps"
Erstellt im Forum Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps! von Wolfgang

18.01.2020 17:44
von

Wolfgang • Zugriffe: 21181

Forum-Bilder mit einstellbarer Größe, Tooltipps und Beschreibung ausstatten - Teil 1-3!
Erstellt im Forum Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps! von Wolfgang

08.06.2022 10:15
von

Wolfgang • Zugriffe: 5420

Sound beim Einloggen ins Forum
Erstellt im Forum Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps! von Wolfgang 3 16.02.2015 23:11
Wolfgang • Zugriffe: 2900

Forum �bersicht → XOBOR-Foren und Homepages →

Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps! → Sound im Bild

Foren Spende

Hallo !

Wir hoffen, dass Dir unser Forum gef�llt und Du Dich hier genauso wohlf�hlst wie wir.

Um Dir und den anderen Mitgliedern das Bestm�gliche bieten zu k�nnen, w�rden wir das Forum gern werbefrei gestalten, mit tollen neuen Extras erg�nzen.

Wenn Du uns dabei unterst�tzen m�chtest, kannst Du mit Hilfe einer kleinen Spende dazu beitragen.

Deine Spende hilft!

Spendenziel: 45 €

37%

⚡Stress‑Test

�

🔥 Konsole �ffnen

Um die Browser-Konsole zu �ffnen, dr�cke:

F12 oder Ctrl + Shift + I

W�hle danach den Reiter Console.

Dort kannst du:
� Test-Anfragen sehen
� Fehler erkennen
� Netzwerk-Infos pr�fen