테스트 사이트 - 개발 중인 베타 버전입니다

답변 수정 삭제 이부분을 채택완료

허걱김선생 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 포인트
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개월 전
답변 감사합니다.

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인