마우스가 이미지버튼에 올라가면 녹음된 음성이 나오는 소스 좀 알려주세요
본문
시각장애인 홈페이지를 만들려고 합니다. 그래서 시각장애인들을 컴퓨터을 할수 있게 협조 고수님들의 협조 부탁드립니다.
현실적으로 시각장애인들은 볼수가 없어서 녹음한 음성을 들어서 컴퓨터를 할 수 있게 도울려고 합니다.
마우스가 이미지 버튼에 올라가면 녹음한 그 카테고리 제목이 음성으로 나오게 하려고 합니다.
음성파일은 mp4로 녹음하였구요... 이제는 이걸 구현 하여야 하는데... 제가 소스를 잘 모르고 어디에 어떻게 넣어야 하는지도 몰라고... 초보자입니다. 자세하고 쉬운 설명 부탁드립니다.
여러분의 도움에 많은 시각자애인들에 도움이 되고자 합니다.
현재 그누보도 5를 기반으로 만들려고 합니다. 초등학생에게 설명한다는 마음으로 자세한 설명 부탁드려요.
감사합니다
답변 4
현실적으로 시각장애인들은 볼수가 없어서 <--- 이런 상황이면 이미지 위에 마우스를어떻게 올려서 음성안내를 들울 수가 있는거죠?
html5 audio <--이렇게 구글 검색해보면 많이 나옵니다
구현은 아래처럼
<audio id='myaudio' controls><source src="" type="audio/mp3" /></audio>
<script>
function myplay($snd){
audiok = document.getElementById("myaudio");
audiok.src = $snd;
audiok.play();
}
</script>
위 태그를 페이지 상단에 넣고 메뉴를 아래처럼 구성
<a hre=~~~ onmouseover="myplay('회사소개.mp3')">회사소개</a>
자바스크립트로 불러야 할거같은데요?
<audio controls>
<source src="파일" type="audio/mp4" />
</audio>
이렇게 하고 오디오에 class 나 id에 값을 넣어줘서 스크립트로 돌리셔야 할거같아여
<td height="200"></td>
<td valign="top"><img src="/image/main-skip-1.jpg" name="Image1" width="300" height="200" id="Image1" onMouseOver="MM_swapImage('Image1','','/image/main-skip-1-1.jpg',1)" onMouseOut="MM_swapImgRestore()"></td>
<td></td>
소스가 이러합니다... 여기서 마우스 오버가 되면 이미지가 바뀌면서 녹음된음성이 나오게 할려고 합니다.. 여기서 어디에 음성 파일을 어떻게 넣어야 하나요?
onMouseOver="MM_swapImage('Image1','','/image/main-skip-1-1.jpg',1);myplay('회사소개.mp3')"
