Run!

jplayer로 플레이어를 붙여봤는데 확인해보니 ie낮은 버전에서는 플레이가 되지를 않는다.

audio태그 역시 구 ie는 지원을 잘 해주지 않기 땜에...또 이리저리 소스를 주어다 조합해 보았다.

음 그리고 bject태그는 object태그이다. 이상한 스크립트가 붙어서 o를 뺐음

우선 html부터

<!-- 컨트롤버튼 --> <p> <a href="#" class="jp-play"><img src="skin/play.png" alt="play" style="width:10%" />재생</a> <a href="#" class="jp-pause"><img src="skin/pause.png" alt="pause" style="width:10%" />일시정지</a> </p> <!-- 플레이어 --> <p> <audio controls id="objAP" loop="true"> <source src="mp3/gae.mp3" type="audio/mpeg" /> <source src="mp3/gae.ogg" type="audio/ogg"> <!-- ie7,8은 audio source태그가 안먹으므로 오브젝트태그로 해준다.--> <bject id="objAP_8" classid="clsid:6BF52A52-394A-11d3-B153-00C04F79FAA6" style="display:none;"> <param name="URL" value="mp3/gae.mp3" /> <param name="uiMode" value="invisible" /> <param name="autoStart" value="false" /> <param name="volume" value="80" /> <param name="playCount" value="10000" /> </bject> </audio> </p>

다음은 스크립트 소스~

<script> $(document).ready(function(){ $(".jp-pause").hide(); //일단 일시정지버튼은 안보이게... $('.jp-play').click(function () { //플레이버튼 클릭했을 때 액션 $(".jp-play").hide(); //플레이버튼대신 $(".jp-pause").show(); //멈춤버튼이 나오고 if (browser.name == "msie" && parseInt(browser.version) <9) //ie 7,8이면 { document.getElementById('objAP_8').controls.play(); //이렇게 재생 }else{ //아니면 $("#objAP").trigger('play'); //이렇게 재생 } }); $('.jp-pause').click(function () { //멈춤버튼 클릭시 액션 $(".jp-pause").hide(); //멈춤버튼을 숨기고 $(".jp-play").show(); //플레이버튼이 나옴 if (browser.name == "msie" && parseInt(browser.version) <9) //ie 7,8이면 { document.getElementById('objAP_8').controls.pause(); //이렇게 멈춤 }else{ //아니면 $("#objAP").trigger('pause'); //이렇게 멈춤 } }); $("#objAP").hide(); 일단 플레이어는 안보여줌 }); //browser detect 브라우저 체크 함수 var browser = (function() { var s = navigator.userAgent.toLowerCase(); var match = /(webkit)[ \/](\w.]+)/.exec(s) || /(opera)(?:.*version)?[ \/](\w.]+)/.exec(s) || /(msie) ([\w.]+)/.exec(s) || !/compatible/.test(s) && /(mozilla)(?:.*? rv:([\w.]+))?/.exec(s) || []; return { name: match[1] || "", version: match[2] || "0" }; }()); </script>

어디선가 줏어온 소스이다.

sns에 퍼가기 할때 한글이 깨지는데 이걸 쓰면 잘 넘어감

script 함수

function encodeURL(str){ var s0, i, s, u; s0 = ""; // encoded str for (i = 0; i < str.length; i++){ // scan the source s = str.charAt(i); u = str.charCodeAt(i); // get unicode of the char if (s == " "){s0 += "+";} // SP should be converted to "+" else { if ( u == 0x2a || u == 0x2d || u == 0x2e || u == 0x5f || ((u >= 0x30) && (u <= 0x39)) || ((u >= 0x41) && (u <= 0x5a)) || ((u >= 0x61) && (u <= 0x7a))){ // check for escape s0 = s0 + s; // don't escape } else { // escape if ((u >= 0x0) && (u <= 0x7f)){ // single byte format s = "0"+u.toString(16); s0 += "%"+ s.substr(s.length-2); } else if (u > 0x1fffff){ // quaternary byte format (extended) s0 += "%" + (oxf0 + ((u & 0x1c0000) >> 18)).toString(16); s0 += "%" + (0x80 + ((u & 0x3f000) >> 12)).toString(16); s0 += "%" + (0x80 + ((u & 0xfc0) >> 6)).toString(16); s0 += "%" + (0x80 + (u & 0x3f)).toString(16); } else if (u > 0x7ff){ // triple byte format s0 += "%" + (0xe0 + ((u & 0xf000) >> 12)).toString(16); s0 += "%" + (0x80 + ((u & 0xfc0) >> 6)).toString(16); s0 += "%" + (0x80 + (u & 0x3f)).toString(16); } else { // double byte format s0 += "%" + (0xc0 + ((u & 0x7c0) >> 6)).toString(16); s0 += "%" + (0x80 + (u & 0x3f)).toString(16); } } } } return s0; }

호출

jquery에 브라우처 체크기능이 있다가 뭔가 에러가 있어서 빠진듯 하다.

이럴땐 수동 함수로...

<script> //상단에 선언 var browser = (function() { var s = navigator.userAgent.toLowerCase(); var match = /(webkit)[ \/](\w.]+)/.exec(s) || /(opera)(?:.*version)?[ \/](\w.]+)/.exec(s) || /(msie) ([\w.]+)/.exec(s) || !/compatible/.test(s) && /(mozilla)(?:.*? rv:([\w.]+))?/.exec(s) || []; return { name: match[1] || "", version: match[2] || "0" }; }()); alert(browser.name); //브라우저 종류 alert(browser.version); //버전 </script>