
사진처럼 리스트가 있구요 닫기버튼을 누르면 밑에있는 리스트들이 닫혀지고
리스트가 닫혀지면 내려간 상태에서 열기버튼을 누르면 다시 리스트가 올라오는 것을 구현하고 싶습니다
리스트 갯수가 많아지면 오른쪽에서 스크롤도 구현하고 싶은데 도와주시면 감사하겠습니다
Copy
<div class="fix_inko" style="display: none;">
<a href="#none" class="cmpr_close2 gtm-tracking"><span>열기</span></a>
</div>
<div class="fix_inko">
<a href="#none" class="cmpr_close2 on gtm-tracking"><span>닫기</span></a>
<table class="inko_list" id="table">
<colgroup>
<col width="8%">
<col width="22%">
<col width="47%">
<col width="2.5%">
<col width="2.5%">
<col width="10%">
<col width="8%">
<col width="">
</colgroup>
<thead>
<tr>
<th>접수일자</th>
<th>사이트명</th>
<th>유지보수 내역</th>
<th>개발</th>
<th>디자인</th>
<th>비고</th>
<th>완료일자</th>
<th>관리</th>
</tr>
</thead>
<tbody>
<? while ($row = sql_fetch_array($result)){?>
<form name = "smpList<?=$row['smp_id']?>" id = "smpList<?=$row['smp_id']?>" method = "post" action = "./inkorea_action.php" autocomplete="off">
<input type="hidden" name="Operation" value="EDIT">
<input type="hidden" name="work_p" id="work_p<?=$row['smp_id']?>" value="<?=$row['work_p']?>">
<input type="hidden" name="work_d" id="work_d<?=$row['smp_id']?>" value="<?=$row['work_d']?>">
<input type="hidden" name="smp_id" value="<?=$row['smp_id']?>">
<tr>
<td><?=$row['date'] ?></td>
<td><?=$row['site_name']?></td>
<td><?=$row['content']?></td>
<td><?if($row['work_p']=="N"){?><a href="javascript:onclick1(<?=$row['smp_id']?>,'Y');" class="btn blueButton">작업완료</a>
<?}else{?>
작업완료
<?}?>
</td>
<td><?if($row['work_d']=="N"){?><a href="javascript:onclick2(<?=$row['smp_id']?>,'Y');" class="btn blueButton">작업완료</a>
<?}else{?>
작업완료
<?}?>
</td>
<td><textarea name="memo" type="text" class="txt frm_input" style="width:100%;line-height:100%;" rows="8"> <?=$row['memo']?></textarea></td>
<td><?if($row['work_d']=="Y" && $row['work_p']=="Y"){?><?=$row['complet_date']?><?}else{?>-<?}?></td>
<td><a href="javascript:updateArticle(<?=$row['smp_id']?>);" class="btn blueButton">수정</a></td>
</tr>
</form>
<?}?>
</tbody>
</table>
</div>
소스 올립니다 자그마한 웹에이전시 신입이라 잘 몰라서 구현하고 싶은 내용을 최대한 구체적으로
적었습니다 도와주시면 감사하겠습니다
|
답변 3개 / 댓글 3개
채택된 답변
+20 포인트
제일간단한 방법
자바스크립트나 제이쿼리로 클릭 이벤트만들어서
밑에 div 에 클래스를 추가,삭제 처리하셈
그리고 css에서 div height 값을 기존높이랑 닫기시 0으로 하고
부드럽게하기위해 transition 시간 추가.
답변에 대한 댓글 1개
minping
2021-03-31 (수) 20:12:28
jquery toggle 찾아보세요!
답변에 대한 댓글 1개
jquery, selector, click event, show, hide, toggle 키워드로 검색해 공부해 보세요.
답변에 대한 댓글 1개
답변을 작성하려면 로그인이 필요합니다.