>  기사  >  웹 프론트엔드  >  웹페이지에서 새 메시지를 깜박이게 만드는 jQuery 코드 title_jquery

웹페이지에서 새 메시지를 깜박이게 만드는 jQuery 코드 title_jquery

WBOY
WBOY원래의
2016-05-16 17:17:391104검색

일부 웹마스터는 이 효과를 느낄 수 있습니다. 일부 SNS 소셜 네트워킹 및 커뮤니티 포럼을 탐색할 때 수신된 새 메시지에 대한 깜박이는 제목 메시지를 자주 볼 수 있습니다. 그러면 이 효과를 우리 웹사이트에 적용할 수 있습니까? 웹페이지의 새 메시지 제목은 무엇입니까? 편집자는 운이 좋게도 jquery 프레임워크를 기반으로 한 어떤 멋진 기술 블로그에서 그러한 코드를 볼 수 있었습니다.

일부 웹 페이지 특수 효과가 실행 후 효과가 표시되지 않는 문제(예: jQuery를 새로 고쳐야 함)를 해결하기 위해 Script House에서는 특별히 웹 버전 데모를 추가했습니다.

코드 복사 코드는 다음과 같습니다.





내 JSP 'test.jsp' 시작 페이지<br> <br><p style="text-align: center;"> ; <br>페이지 제목의 효과를 확인하세요! <br><br /> <br>10초 후에 프롬프트가 사라집니다.<br></p> <br><script type="text/javascript" <BR>src="script/jquery-2.0 .3.js"> <br></script> <br><script type="text/javascript"> <br><br>(function($) { <br>$.extend( { <br>/**<br>* 호출 방법: var timeArr = $.blinkTitle.show() <br>* $.blinkTitle.clear(timerArr) <br>*/ <br>blinkTitle : { <br>show : function() { //새 메시지가 있으면 제목에 깜박이는 프롬프트<br>var step = 0, _title = document.title ; <br>var 타이머 = setInterval(function() { <br>단계 ; <br>if (단계 == 3) { <br>단계 = 1 <br>} <br><br>if (단계 == 1) { <br>document.title = '【 】' _title <br>} <br><br>if (단계 == 2) { <br>document.title = '[새 메시지]' _title <br> } <br><br>}, 500); <br>return [ 타이머, _title ] <br>}, <br>/**<br>* @param timeArr[0], 타이머 태그 <br>* @param timeArr[1], 초기 제목 텍스트 내용 <br>*/ <br>clear : function(timerArr) { // 깜박이는 프롬프트를 제거하고 초기 제목 텍스트를 복원합니다. <br>if (timerArr) { <br>clearInterval(timerArr[0]) <br>document.title =timerArr[1]; <br><br>} <br>} <br>}); <br>})(jQuery) <br>// http://www.jb51.net/down <br>jQuery(function($) { <br> var timeArr = $.blinkTitle.show(); <br>setTimeout(function() { //일정 시간이 지나면 자동으로 사라집니다. <br>$.blinkTitle.clear(timerArr); <br>} , 10000) ; <br>//작업이 사라진 것으로 생각되면 다음과 같이 호출하세요. $.blinkTitle.clear(timerArr) <br>}) <br></script> br /> <br><center> <br>효과가 표시되지 않으면 Ctrl F5를 눌러 이 페이지를 새로 고치세요. <br><a href='http://www.jb51 .net/' target='_blank '>http://www.jb51.net/</a> <br></center> <br></body> <br><br></p>
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.