모바일 소스 오류가 납니다...
관련링크
본문
1. 모바일에서 일정표를 안보이게할려고 작업은 했는데 일요일 내용들이 옆으로 밀려서 보입니다.
2. 일정을 안 넣었을 경우 오늘은 일정이 없습니다.를 나오게 하고 싶어요. 해봤더니. 일정이 있을때도 같이 나와서요...
<div style="width:<?php echo is_mobile() ? 0 : 50?>%;float:left;">
<div class="cal" style="">
<table width= "100%" cellSpacing="2" cellPadding="0" border="0" align="center">
<tr style="border-bottom: 1px solid #ccc;">
<td align="center" class="bgsun">일</td>
<td align="center" class="bgweek">월</td>
<td align="center" class="bgweek">화</td>
<td align="center" class="bgweek">수</td>
<td align="center" class="bgweek">목</td>
<td align="center" class="bgweek">금</td>
<td align="center" class="bgsat">토</td>
</tr>
<tr>
<td colspan="7" bgcolor="#DDDDDD"></td>
</tr>
<?php
$cday = 1;
$sel_mon[i] = sprintf("%02d",$month);
$query = "select * from ".$g5['write_prefix'].$bo_table." where left(wr_1,6) <= '".$year.$sel_mon[i]."' and left(wr_2,6) >= '".$year.$sel_mon[i]."' order by wr_id asc";
//echo $query;
$result = sql_query($query);
// 내용을 보여주는 부분
while ($row = sql_fetch_array($result)) { // 제목글 뽑아서 링크 문자열 만들기..
if( substr($row[wr_1],0,6) < $year.$sel_mon[i] ) {
$start_day[i] =1;
$start_day[i]= (int)$start_day[i];
} else {
$start_day[i] = substr($row[wr_1],6,2);
$start_day[i]= (int)$start_day[i];
}
if( substr($row[wr_2],0,6) > $year.$sel_mon[i] ) {
$end_day[i] = $lastday[$month];
$end_day[i]= (int)$end_day[i];
} else {
$end_day[i] = substr($row[wr_2],6,2);
$end_day[i]= (int)$end_day[i];
}
//echo "start_day = ".$start_day[i] ."<br>";
//echo "end_day = ".$end_day[i] ."<br>";
for ($i = $start_day[i] ; $i <= $end_day[i]; $i++) {
$html_day[$i] = "1";
}
}
// 달력의 틀을 보여주는 부분
// 여기부터 분석하면 됨
$temp = 7- (($lastday[$month]+$dayoftheweek)%7);
// $dayoftheweek; // 6 이다.
// $temp = 6 이다. 무슨 의미인가?
if ($temp == 7) $temp = 0;
$lastcount = $lastday[$month]+$dayoftheweek + $temp;
// $lastcount = 42
// $lastcount 는 달력을 이루고 있는 전체 셀의 갯수이다. 2003년 11월은 날짜 30개와 빈칸 12개 다.
//
for ($iz = 1; $iz <= $lastcount; $iz++) { // 42번을 칠하게 된다.
$bgcolor = "#ffffff"; // 쭉 흰색으로 칠하고
$offset = $iz%7;
if ($offset == 1) echo (" <tr>\n"); // 주당 7개씩 한쎌씩을 쌓는다.
if ($dayoftheweek < $iz && $iz <= $lastday[$month]+$dayoftheweek) {
if ($b_year==$year && $b_mon==$month && $b_day==$cday) {
$cstyle = 'today';
} else {
$cstyle = 'valid';
}
switch ($offset) { // 요일에 따라 날짜의 색깔 결정
case 1: $dstyle = 'sunday';
break;
case 0: $dstyle = 'saturday';
break;
default: $dstyle = 'weekday';
}
// 전체 루프안에서 숫자가 들어가는 셀들만 해당됨
// 즉 11월 달에서 1일부터 30 일까지만 해당
$daytext = "$cday"; // $cday 는 숫자 예> 11월달은 1~ 30일 까지
$f_date = $year.sprintf("%02d",$month).sprintf("%02d",$cday);
//$daytext 은 셀에 써질 날짜 숫자 넣을 공간
//if ($iz%7 == 1) $daytext = "<font color=red>$daytext</font>"; // 일요일
//if ($iz%7 == 0) $daytext = "<font color=blue>$daytext</font>"; // 토요일
// 여기까지 숫자와 들어갈 내용에 대한 변수들의 세팅이 끝나고
// 이제 여기 부터 직접 셀이 그려지면서 그 안에 내용이 들어 간다.
$myarray = soltolun($year,$month,$cday);
$moonday="";
echo (" <td class='".$cstyle."'>");
//echo "<p class='".$dstyle."'>".$daytext.$moonday."</p>";
if ($html_day[$cday]) {
echo "<p class='selDay'>";
echo "<a href=\"javascript:nowDayList('{$bo_table}','{$year}','{$month}','{$cday}','{$options["mobile"]}')\" class='writeday'>";
echo "<b>".$daytext."</b>";
echo "</a>";
echo "</p>";
}
else { // 글쓰기 권한이 없으면 글쓰기 링크는 넣지 않고 그냥 숫자만 출력하기
echo "<p class='".$dstyle."'>".$daytext."</p>";
}
// echo $html_day[$cday];
echo ("</td>\n"); // 한칸을 마무리
$cday++; // 날짜를 카운팅
}
// 11월에서 1일부터 30일에 해당되지 않으면 그냥 회색을 칠한다.
else { echo (" <td class='invalid'> </td>\n"); }
if (($iz%7) == 0) echo (" </tr>\n");
} // 반복구문이 끝남
?>
</table>
</div>
</div>
<style>
#changeNowListBox { padding: 12px 12px; height: 254px; width: 99.8%; }
#changeNowListBox .NowListBoxYear { font-size: 19px; font-weight: 600; color: #f9aa83; text-align: left; padding: 0px 0px 2px; }
#changeNowListBox .NowListBoxYear::after { content: "\f073"; font-family: "Font Awesome 5 Free"; font-size: 50px; position: relative; top: 25px; right: -133px; }
#changeNowListBox .NowListBoxMonthDay { font-size: 21px; font-weight: 600; color: #ff8040; text-align: left; padding: 0px 0px 5px; border-bottom: 3px solid #ff8040; }
#changeNowListBox table { padding: 3px 0 0 0; /* width: 260px; */ table-layout: fixed; }
#changeNowListBox table tr { }
#changeNowListBox table tr td { width: 260px; font-size: 15px; font-weight: 600; color: #ff8040; text-align: left; padding: 5px 0px 3px; /* white-space: nowrap; */ text-overflow: ellipsis; overflow: hidden; }
.NowListUl {margin-left: 15px;}
.NowListUl li {list-style: disc;font-size: 15px; font-weight: 600; color: #00000; text-align: left;padding: 5px 0px 3px;}
.more_ { position: absolute; top: 53px; right: 25px; }
.more_ a { font-size: 31px; font-weight: 700; color: #ff8040; }
@media(max-width:767px){
#changeNowListBox { padding: 12px 12px; height: 178px; width: 99.8%; position: relative; }
#changeNowListBox .NowListBoxYear { font-size: 11px; font-weight: 600; color: #ff8040; text-align: left; padding: 0px 0px 2px; }
/*#changeNowListBox .NowListBoxYear::after { content: "\f073"; font-family: "Font Awesome 5 Free"; font-size: 32px; position: absolute; top: 408px; right: 32px; }*/
#changeNowListBox .NowListBoxYear::after { content: "\f073"; font-family: "Font Awesome 5 Free"; font-size: 23px; position: absolute; top: 22px; right: 18px; }
#changeNowListBox .NowListBoxMonthDay { font-size: 13px; font-weight: 600; color: #ff8040; text-align: left; padding: 0px 0px 5px; border-bottom: 3px solid #ff8040; }
#changeNowListBox table { padding: 3px 0 0 0; width: 152px; table-layout: fixed; }
#changeNowListBox table tr { }
#changeNowListBox table tr td { width: 152px; font-size: 10px; font-weight: 600; color: #ff8040; text-align: left; padding: 2px 0px 1px; /* white-space: nowrap; */ text-overflow: ellipsis; overflow: hidden; }
.more_ { position: absolute; top: -5px; right: 5px; }
.more_ a { font-size: 21px; font-weight: 700; color: #ff8040; }
}
</style>
<div class="" style="width: <?php echo is_mobile() ? 100 : 50 ?>%; float: left;;overflow: auto;background: #ffffff; ">
<div id="changeNowListBox">
<div class="NowListBoxYear"><?= date("Y년"); ?><div class="more_"><a href="/bbs/board.php?bo_table=0403<?= $options["mobile"] ? "&mode=week" : "" ?>"> + </a></div></div>
<div class="NowListBoxMonthDay"><?= date("m월 d일")?> <?php $yoil_text_set = array("일요일","월요일","화요일","수요일","목요일","금요일","토요일"); $yoil = $yoil_text_set[date('w', strtotime(date("Y-m-d")))]; echo $yoil; ?></div>
<?php
$myListSql = "select * from ".$g5['write_prefix'].$bo_table." where left(wr_1,8) <= '".$year.$sel_mon[i].sprintf("%02d",$mday)."' and left(wr_2,8) >= '".$year.$sel_mon[i].sprintf("%02d",$mday)."' order by wr_id asc";
$myListRes = sql_query($myListSql);
?>
<ul class="NowListUl">
<?php while($row = sql_fetch_array($myListRes)) :
switch ($row["wr_9"])
{
case "background:rgb(243,80,85)":
$tmpName = "[이천IL]";
break;
case "background:rgb(131,183,48);":
$tmpName = "[서비스지원국]";
break;
case "background:rgb(249, 188, 35);":
$tmpName = "[여성장애인교육팀]";
break;
case "background:rgb(66,174,220);":
$tmpName = "[체험홈]";
break;
case "background:rgb(128, 65, 217);":
$tmpName = "[주간활동]";
break;
case "background:rgb(1, 0, 225);":
$tmpName = "[방과후활동]";
break;
}
?>
<li>
<div style="display: inline;"><?= $tmpName ?><?= $row["wr_subject"] ?></div>
</li>
<?php endwhile ?>
</ul>
</div>
</div>
답변 4
1. 모바일에서 일정표를 안보이게할려고 작업은 했는데 일요일 내용들이 옆으로 밀려서 보입니다.
관련 css 찾아보시고 해결해야할것 같습니다. 고정.크기.레이이웃.셀크기.간격.등등;--;;; 천천히 천천히 해결하세요 ;;
2. 일정을 안 넣었을 경우 오늘은 일정이 없습니다.를 나오게 하고 싶어요. 해봤더니. 일정이 있을때도 같이 나와서요...
이건...;;;
<ul class="NowListUl">
<?php if (sql_num_rows($myListRes) > 0) : ?>
<?php while($row = sql_fetch_array($myListRes)) :
switch ($row["wr_9"])
{
case "background:rgb(243,80,85)":
$tmpName = "[이천IL]";
break;
case "background:rgb(131,183,48);":
$tmpName = "[서비스지원국]";
break;
case "background:rgb(249, 188, 35);":
$tmpName = "[여성장애인교육팀]";
break;
case "background:rgb(66,174,220);":
$tmpName = "[체험홈]";
break;
case "background:rgb(128, 65, 217);":
$tmpName = "[주간활동]";
break;
case "background:rgb(1, 0, 225);":
$tmpName = "[방과후활동]";
break;
}
?>
<li>
<div style="display: inline;"><?= $tmpName ?><?= $row["wr_subject"] ?></div>
</li>
<?php endwhile ?>
<?php else : ?>
<li>
<div style="display: inline;">오늘은 일정이 없으니 쉬는 날 입니다..</div>
</li>
<?php endif; ?>
</ul>
// 이렇게 추가해보세요 그럼 메시지 갈 것 에요
작업전에 백업하신 소스가 있으실까요?
소스중에 css상 밀리는거 같은데
코딩틀 수정을 다시 해보셔야 할듯 합니다.
질문의 내용으로 볼때 다음과 같이 할 수 있을 것 같습니다.
1. 모바일에서 일정표가 밀리는 문제
<style>
/* ... (기존 스타일들) ... */
/* 수정된 스타일 */
#changeNowListBox {
padding: 12px;
max-height: 254px;
width: 100%;
overflow: auto;
background: #ffffff;
}
/* ... (나머지 스타일들) ... */
</style>
현재 코드에서 width를 설정하고 있어서 모바일에서도 고정된 너비를 가지게 되면서 일정표가 옆으로 밀리는 문제가 발생합니다. 모바일 화면에서는 뷰포트에 맞게 자동으로 조절되도록 수정해야 합니다.
max-width를 사용하여 최대 너비를 제한하고, width를 100%로 설정하여 자동 조절되도록 변경할 수 있습니다.
반응형으로 제작을 하셨으므로 미디어쿼리에 맞게 조절 하셔야 합니다.
2. 일정이 없을때 메세지 표시
<ul class="NowListUl">
<?php
if (sql_num_rows($myListRes) > 0) {
while($row = sql_fetch_array($myListRes)) {
// ... (기존의 내용 유지)
}
} else {
echo "<li>오늘은 일정이 없습니다.</li>";
}
?>
</ul>
일정이 없을 때 "오늘은 일정이 없습니다."라는 메시지를 표시하기 위해서는 조건문을 사용하여 일정이 있는 경우와 없는 경우를 구분하시면 될 것 샅습니다.
sql_num_rows() 함수를 사용하여 결과 레코드의 개수를 확인하여 일정이 없을 경우에만 해당 메시지를 표시하도록 수정하시면 될 것 같네요
참고 하셔서 원하시는 형태로 수정하시면 될 듯 합니다.
전체적으로 CSS 및 레이아웃이 깨지는것 같습니다. 백업파일 있으시면 우선 대체를 해보세요
$cday = 1;
$sel_mon[i] = sprintf("%02d",$month);
$query = "select * from ".$g5['write_prefix'].$bo_table." where left(wr_1,6) <= '".$year.$sel_mon[i]."' and left(wr_2,6) >= '".$year.$sel_mon[i]."' order by wr_id asc";
//echo $query;
$result = sql_query($query);
If( sql_num_rows( $result) >0) {
?><table width= "100%" cellSpacing="2" cellPadding="0" border="0" align="center">
<tr style="border-bottom: 1px solid #ccc;">
<td align="center" class="bgsun">일</td>
<td align="center" class="bgweek">월</td> ...
<td align="center" class="bgsat">토</td>
</tr>
<tr>
<td colspan="7" bgcolor="#DDDDDD"></td>
</tr>
....
</table>
<?php } else
Echo "일정이 없습니다.";
