Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript] Dźwięk po kliknięciu w obrazek
Forum PHP.pl > Forum > Przedszkole
slimboot
Wiem, ze może pytanie banalne, ale javascript, to dla mnie coś niezrozumiałego, dlatego prosze o pomoc


Ten skrypt po kliknięciu w button aktywuje dźwięk. Jak zrobić by zamiast buttona był wstawiony obrazek? Próbowałem wstawiać type="image" i src="car.jpg" zamiast type="button", ale to nie pomaga



Kod
<head>
<script language="javascript" type="text/javascript">
function play(){
document.getElementById("muzyka").play()
}
</script>

</head>
<body>

<embed src="ding.wav" hidden="true" autostart="false" id="muzyka". mastersound><p>
<form>
<input type="button" value="play" onclick="play()">
</form>

</body>
</html>
vermis
Kod
<img src="adres_obrazka" onclick="play()">

slimboot
Super! Wielkie dzięki. Sam bym się z tym chyba męczył wieki biggrin.gif

Mam jeszcze jedno pytanie, bo myślałem, że już wiem wszystko co potrzebuje, a jednak nie. Pradze sobie z całą resztą, ale nie wiem jak zmodyfikować ten kod, bym mógł przypisać kilka różnych obrazków i do każdego z nich inny dźwięk. Próbowałem na kilka sposobów i nic mi nie wychodzi

Ten kod wygląda teraz tak:

Kod
<head>

<script language="javascript" type="text/javascript">
function play(){
document.getElementById("muzyka1").play()
}
</script>
</head>

<body>

<embed src="ding.wav" hidden="true" autostart="false" id="muzyka1". mastersound><p>
<form>
<img src="car.jpg" onclick="play()">
</form>

</body>
</html>
vermis
Piszę z głowy, ale chyba tak powinno być dobrze.
Jako parametr przekazujesz id elementu z dzwiękiem.
Kod
<head>

<script language="javascript" type="text/javascript">
function play(song){
document.getElementById(song).play()
}
</script>
</head>

<body>

<embed src="ding.wav" hidden="true" autostart="false" id="muzyka1". mastersound><p>
<embed src="ding2.wav" hidden="true" autostart="false" id="muzyka2". mastersound><p>
<form>
<img src="car.jpg" onclick="play('muzyka1')">
<img src="car2.jpg" onclick="play('muzyka2')">
</form>

</body>
</html>

slimboot
Pisane z głowy i działa idealnie. Dziękówa
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.