쿠키를 이용하여 사용자가 현재 페이지에 몇번째 방문인지를 알려줍니다. 텍스트 기반 쿠기 카운터 인데 모양을
내기 위해 CSS를 이용했네요. 데모를 눌러 확인하세요.
| Script Example |
<html>
<head><title>데모</title>
<style>
.counter{
background-color:black;
color:yellow;
font-weight:bold;
}
</style>
<SCRIPT>
expireDate = new Date
expireDate.setMonth(expireDate.getMonth()+6)
jcount = eval(cookieVal("jaafarCounter"))
jcount++
document.cookie = "jaafarCounter="+jcount+";expires="
+ expireDate.toGMTString()
function cookieVal(cookieName) {
thisCookie = document.cookie.split("; ")
for (i=0; i<thisCookie.length; i++){
if (cookieName == thisCookie[i].split("=")[0]){
return thisCookie[i].split("=")[1]
}
}
return 0
}
function page_counter(){
for (i=0;i<(7-jcount.toString().length);i++)
document.write('<span class="counter">0</span>')
for (y=0;y<(jcount.toString().length);y++)
document.write('<span class="counter">'+jcount.toString().charAt(y)+'</span>')
}
</SCRIPT>
</head>
<body>
당신은 이 페이지에 <SCRIPT> page_counter(jcount);
</SCRIPT> 번 방문하셨습니다.<br>
리로드해보세요.
</body>
</html> |
|
|
| 설명 |
| head 태그안에 빨간색부분은 글자를 이쁘게 하기 위한 CSS적용입니다.
그리고 녹색부분이 스크립트 코드입니다. body 태그 안에 실제로 표시되는
부분은 <SCRIPT> page_counter(jcount);
</SCRIPT> 입니다. 이게 숫자를 나타냅니다. 그 앞뒤로 내가 원하는
메세지를 입력하시면 됩니다. 쿠키를 이용한 개인용 카운터입니다.즉 방문객 하나
하나 별로 적용되는것입니다. 전체 카운터와는 다름 개념입니다. |
|
|
|
|
