답변 수정 삭제 이부분을 채택완료
허걱김선생
3개월 전
조회 602
수고 하십니다.
코멘트에서 답변이나 글 수정을 하려고 하면 ... 버튼을 눌러야 해당 메뉴가 노출 되는데요.
http://sir.kr/data/editor/2507/1888603148_1753427861.3836.png" width="106" />
답변 수정 삭제 버튼이 미리 나와 이겠게 하려면 어떻게 해야 할까요?
답변 ㅣ 수정 ㅣ 삭제
가로로 정렬 되어 나오게 하고 싶습니다.
</p>
<p>.bo_vc_act {display:none;position:absolute;right:0;top:40px;width:58px;text-align:right;border:1px solid #b8bfc4;margin:0;list-style:none;background:#fff;zoom:1;z-index:9999}
.bo_vc_act:before {content:"";position:absolute;top:-8px;right:5px;width:0;height:0;border-style:solid;border-width:0 6px 8px 6px;border-color:transparent transparent #b8bfc4 transparent}
.bo_vc_act:after {content:"";position:absolute;top:-6px;right:5px;width:0;height:0;border-style:solid;border-width:0 6px 8px 6px;border-color:transparent transparent #fff transparent}
.bo_vc_act li {border-bottom:1px solid #f0f0f0}
.bo_vc_act li:last-child {border-bottom:0}
.bo_vc_act li a {display:inline-block;padding:10px 15px}
.bo_vc_act li a:hover {color:#3a8afd}</p>
<p>
</p>
<p> <?php if($is_comment_reply_edit){ ?>
<div class="bo_vl_opt">
<button type="button" class="btn_cm_opt btn_b01 btn"><svg xmlns="<a href="http://www.w3.org/2000/svg"" target="_blank" rel="noopener noreferrer">http://www.w3.org/2000/svg"</a> width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-more-horizontal"><circle cx="12" cy="12" r="1"></circle><circle cx="19" cy="12" r="1"></circle><circle cx="5" cy="12" r="1"></circle></svg></button>
<ul class="bo_vc_act">
<?php if ($list[$i]['is_reply']) { ?><li><a href="<?php echo $c_reply_href; ?>" onclick="comment_box('<?php echo $comment_id ?>', 'c'); return false;">답변</a></li><?php } ?>
<?php if ($list[$i]['is_edit']) { ?><li><a href="<?php echo $c_edit_href; ?>" onclick="comment_box('<?php echo $comment_id ?>', 'cu'); return false;">수정</a></li><?php } ?>
<?php if ($list[$i]['is_del']) { ?><li><a href="<?php echo $list[$i]['del_link']; ?>" onclick="return comment_delete();">삭제</a></li><?php } ?>
</ul>
</div>
<?php } ?>
<script>
$(function() {
// 댓글 옵션창 열기
$(".btn_cm_opt").on("click", function(){
$(this).parent("div").children(".bo_vc_act").show();
});
// 댓글 옵션창 닫기
$(document).mouseup(function (e){
var container = $(".bo_vc_act");
if( container.has(e.target).length === 0)
container.hide();
});
});
</script></p>
<p>
감사합니다.
댓글을 작성하려면 로그인이 필요합니다.
답변 2개
채택된 답변
+20 포인트
미니님a
Expert
3개월 전
1. 스크립트를 제거 해주세요
</p>
<p> <script></p>
<p> $(function() { </p>
<p> // 댓글 옵션창 열기</p>
<p> $(".btn_cm_opt").on("click", function(){</p>
<p> $(this).parent("div").children(".bo_vc_act").show();</p>
<p> });</p>
<p> </p>
<p> // 댓글 옵션창 닫기</p>
<p> $(document).mouseup(function (e){</p>
<p> var container = $(".bo_vc_act");</p>
<p> if( container.has(e.target).length === 0)</p>
<p> container.hide();</p>
<p> });</p>
<p> });</p>
<p> </script></p>
<p>
2. 버튼을 제거 해주세요
</p>
<p> <button type="button" class="btn_cm_opt btn_b01 btn"><i class="fa fa-ellipsis-v" aria-hidden="true"></i><span class="sound_only">댓글 옵션</span></button></p>
<p>
3. style.css 파일을 해당 부분만 수정 해주세요
</p>
<p>.bo_vc_act {</p>
<p> display: none;</p>
<p> position: static;</p>
<p> width: auto;</p>
<p> text-align: right;</p>
<p> border: 1px solid #b8bfc4;</p>
<p> margin: 0;</p>
<p> list-style: none;</p>
<p> background: #fff;</p>
<p> zoom: 1;</p>
<p> z-index: 9999;</p>
<p> padding: 0;</p>
<p> /* flex 적용 */</p>
<p> display: flex;</p>
<p> flex-direction: row;</p>
<p> justify-content: flex-end;</p>
<p> align-items: center;</p>
<p> gap: 0;</p>
<p>}</p>
<p>.bo_vc_act:before,</p>
<p>.bo_vc_act:after {</p>
<p> display: none;</p>
<p>}</p>
<p>.bo_vc_act li {</p>
<p> border-bottom: none;</p>
<p> border-right: 1px solid #f0f0f0;</p>
<p>}</p>
<p>.bo_vc_act li:last-child {</p>
<p> border-right: 0;</p>
<p>}</p>
<p>.bo_vc_act li a {</p>
<p> display: inline-block;</p>
<p> padding: 10px 15px;</p>
<p>}</p>
<p>.bo_vc_act li a:hover {</p>
<p> color: #3a8afd;</p>
<p>}</p>
<p>
![]()
css는 자유롭게 꾸미시면 되겠습니다.
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
�
허걱김선생
3개월 전
댓글을 작성하려면 로그인이 필요합니다.
3개월 전
.bo_vc_act {display:block;position:absolute;right:0;top:40px;width:58px;text-align:right;border:1px solid #b8bfc4;margin:0;list-style:none;background:#fff;zoom:1;z-index:9999}
.bo_vc_act li {float:left;border-bottom:1px solid #f0f0f0}
이렇게 해보세요
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
�
허걱김선생
3개월 전
답변 감사합니다.
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
감사합니다.