지정된 날짜에 이미지 변경
본문
현재 요일, 정해진 시간별로 이미지가 변경되는 자바스크립트를 사용중입니다.
이 스크립트를 여러군데 사용하다보니 지정한 토요일과 일요일이 아닌 휴일(국가지정공휴일같은)에는 임의로 이미지를 변경해야해서 변경했다가 다시 복구하고 하는 것도 점점일이 되어가고 있습니다...
그래서 혹시 현재 사용중인 이 스크립트에서 광복절, 추석같은 임의날짜를 지정하여 이미지를 보여줄수 없을까요?
현재 사용중인 소스입니다.
<script language="JavaScript">
<!--
day=new Date() ;
var d = '<?=date('w')?>';
var x = '<?=date('H')?>';
if ((d == 6 && x >= 1) || d == 0) {
document.write('<img src="<?=$g4['path']?>/img/qna_notice_01.png">');
} else {
x=day.getHours() ;
if(x>=0 && x<11) {
document.write('<img src="<?=$g4['path']?>/img/qna_notice_02.png">');
} else
if(x>=11 && x<12) {
document.write('<img src="<?=$g4['path']?>/img/qna_notice_04.png">');
} else
if(x>=12 && x<13) {
document.write('<img src="<?=$g4['path']?>/img/qna_notice_03.png">');
} else
if(x>=13 && x<18) {
document.write('<img src="<?=$g4['path']?>/img/qna_notice_04.png">');
} else
if (x>=18 && x<24) {
document.write('<img src="<?=$g4['path']?>/img/qna_notice_02.png">');
}
}
//-->
</script>
이렇게 되어있는데 어린이날, 광복절, 추석같은 날짜를 지정하여 이미지를 따로 지정할수 있는 방법이 있다면 도움좀 부탁드립니다..ㅠㅠ
답변 2
<img src="" id="test" />
<script>
var DATE = new Date();
var Year = DATE.getFullYear();
var Month = DATE.getMonth() + 1;
var Day = DATE.getDate();
var Today = Year + "-" + Month + "-" + Day;
var Holidays = {
"2014-8-14" : "http://pagead2.googlesyndication.com/simgad/12146247908501250763",
"2014-8-15" : "http://pagead2.googlesyndication.com/simgad/13177216673612256820",
"2014-8-16" : "http://pagead2.googlesyndication.com/simgad/3815350622856322910"
}
if(Holidays[Today]) {
document.getElementById("test").src = Holidays[Today];
}
</script>
js로는 힘드네요.
차라리 php가 편한데.
우와 답변감사드립니다. (__
근데 제본문의 스크립트안에서 날짜 지정부분만 추가할수는 없는건가요?
기존 스크립트의 시간별과 토요일, 휴무이미지 변경을 그대로 쓰면서 지정된날짜에는 이미지를 적용하고 싶은건데
너무 번거로운 문의 염치없이 드려서 죄송합니다..ㅠㅠ
<script language="JavaScript">
var DATE = new Date();
var tYear = DATE.getFullYear();
var tMonth = DATE.getMonth() + 1;
var tDate = DATE.getDate();
var tDay = DATE.getDay();
var tHour = DATE.getHours();
var Today = tYear + "-" + tMonth + "-" + tDate;
var Holidays = {
"2014-8-14" : "http://pagead2.googlesyndication.com/simgad/12146247908501250763",
"2014-8-16" : "http://pagead2.googlesyndication.com/simgad/13177216673612256820",
"2014-8-17" : "http://pagead2.googlesyndication.com/simgad/3815350622856322910"
}
function _time(f, t) {
return (tHour >= f && tHour < t) ? true : false;
}
if(Holidays[Today]) {
document.write("<img src='" + Holidays[Today] + "' />");
} else {
if((tDay == 6 || tDay == 0) && tHour >= 1) {
document.write('<img src="<?=$g4['path']?>/img/qna_notice_01.png">');
} else {
if(_time(0, 11) == true) {
document.write('<img src="<?=$g4['path']?>/img/qna_notice_02.png">');
} else if(_time(11, 12) == true) {
document.write('<img src="<?=$g4['path']?>/img/qna_notice_04.png">');
} else if(_time(12, 13) == true) {
document.write('<img src="<?=$g4['path']?>/img/qna_notice_03.png">');
} else if(_time(13, 18) == true) {
document.write('<img src="<?=$g4['path']?>/img/qna_notice_04.png">');
} else if(_time(18, 24) == true) {
document.write('<img src="<?=$g4['path']?>/img/qna_notice_02.png">');
}
}
}
</script>
특정 날짜는 저 위에 지금 넣어둔 날짜에다가 집어 넣으시면 됩니다.
원래 코드를 조금이라도 줄이고자 약간 변형만 했습니다.
우와 너무 감사합니다..ㅠㅠ
진짜 복받으실거예요...
자꾸 뭘 물어보기가 민망하긴 한데 ㅠㅠ
원래 소스가 서버시간으로 적용되라고 <?=date('w')?>, <?=date('H')?> 이렇게 되어있던건데 해주신 소스에 이런건 적용이 안되는거겠죠?
하여튼 너무 너무 감사드립니다. (__)
그게 현재 요일 갖고 오는 거라서요.
0 ~ 6까지 숫자 갖고 오는 건데, 제가 코딩한 저기에도 있습니다.
getDay() 저 함수가 php 함수 date("w")랑 같은 역할합니다.
다른 점은 php는 서버 시간을 갖고 오고 js는 로컬 시간을 갖고 온다는 거라서...
요즘은 개인이 쓰는 컴퓨터도 시간 잘 맞으니 크게 걱정 안 하셔도...ㅎㅎ
영 찝찝하시면 위에 나온 시간 관련 부분은 전부 서버로 갖고 오셔도 돼요.
늦은시간까지 고생이 많으십니다...ㅜㅜ
자꾸 질문해서 죄송하고 답변주셔서 감사합니다 (__
된다면 서버시간을 가져오고 싶어서....
var d = '<?=date('w')?>';
var x = '<?=date('H')?>';
전에 이 소스로 유추해서 내맘대로
var tYear = <?=date('y')?>;
var tMonth = <?=date('m')?> + 1;
var tDate = <?=date('d')?>;
var tDay = <?=date('w')?>;
var tHour = <?=date('h')?>;
이렇게 해봤는데 역시나 안되네요... 년,월,일은 어찌해야하는건지...
에고 자꼬 귀찮게 해드려서 죄송합니다..ㅠㅠ
늦은시간까지 고생이 많으십니다...ㅜㅜ
자꾸 질문해서 죄송하고 답변주셔서 감사합니다 (__
된다면 서버시간을 가져오고 싶어서....
var d = '<?=date('w')?>';
var x = '<?=date('H')?>';
전에 이 소스로 유추해서 내맘대로
var tYear = <?=date('y')?>;
var tMonth = <?=date('m')?> + 1;
var tDate = <?=date('d')?>;
var tDay = <?=date('w')?>;
var tHour = <?=date('h')?>;
이렇게 해봤는데 역시나 안되네요... 년,월,일은 어찌해야하는건지...
에고 자꼬 귀찮게 해드려서 죄송합니다..ㅠㅠ
정상적으로 한 거 맞습니다.
안 된다는 게 어떻ㄱ 안 된다는 말씀이신지요?
계란님이 해주신 소스로 하면 정상적으로 오늘 휴무일로 나오는데요.
<?=date('y')?>,<?=date('m')?>,<?=date('d')?> 이렇게 바꾸면 오늘 휴무일로 인식을 못하고 그냥 평일 이시간에 맞는 이미지가 나오네요.. 시간이나 요일은 인식을 하는거 같은데 년월일은 서버시간으로 바꾸면 인식을 못하나봐요..ㅠㅠ