0
조회 수 : 223 신고 : 0
미리보기 : | https://www.webmini.net/toggle |
---|
html
<div class="view_reply">
<div class="reply_1dep">
리스트 내용1 <button class="bt_more">더보기</button>
</div>
<div class="wrap_reply_2dep">
리스트 내용2 버튼 눌렀을때 보여질 내용
</div>
</div>
<div class="view_reply">
<div class="reply_1dep">
리스트 내용2 <button class="bt_more">더보기</button>
</div>
<div class="wrap_reply_2dep">
리스트 내용2 버튼 눌렀을때 보여질 내용
</div>
</div>
css
.view_reply{padding:10px 15px;border-bottom:1px solid #000}
.view_reply .reply_1dep{padding:8px 0;font-size:13px}
.view_reply .bt_more{position:relative;top:-1px;left:5px;padding:5px 8px;border:1px solid #000;border-radius:3px;background:#444;color:#fff;cursor:pointer}
.view_reply .wrap_reply_2dep{padding:15px 0;border-top:1px dotted #ddd;color:#999;font-size:13px}
script
$(document).ready(function(){
$('.view_reply .wrap_reply_2dep').hide();
$('.reply_1dep .bt_more').click(function(){
if ($(this).hasClass('on')){
$(this).removeClass('on');
$(this).parent().parent().find('.wrap_reply_2dep').slideUp();
}else{
$(this).addClass('on');
$(this).parent().parent().find('.wrap_reply_2dep').slideDown();
}
});
});
추천수 10단위당 메달이 1개씩 노출되고, 추천수에 따라 배경색이 변하며, 일정수의 추천수를 받을시

- 추천수 50개이상
- 추천수 30개이상
- 추천수 20개이상
- 추천수 10개이상
- 추천수 3개이상

첫번째 댓글을 남겨주세요!