Extra Form
PHP PHP 7.3
CMS XpressEngine

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
                        <style>
                        a#MOVE_TOP_BTN {
                            position: fixed;
                            right: 2%;
                            bottom: 10px;
                            right:20px;
                            display: none;
                            z-index: 999;
                        }
                        </style>
                        <script>
                            $(function() {
                                $(window).scroll(function() {
                                    if ($(this).scrollTop() > 100) {
                                        $('#MOVE_TOP_BTN').fadeIn();
                                    } else {
                                        $('#MOVE_TOP_BTN').fadeOut();
                                    }
                                });
                                $("#MOVE_TOP_BTN").click(function() {
                                    $('html, body').animate({
                                        scrollTop : 0
                                    }, 400);
                                    return false;
                                });
                            });
                        </script>
                        <a id="MOVE_TOP_BTN" href="#"><img src="/img/up-arrow-icon.png" width="50px" height="50px"></a>

 

해당 코드를 레이아웃 html container부분에 넣어줫는데 top버튼은 잘 작동하지만 게시글 작성할려 할때 에디터가 보이지 않습니다.

 

뭐가 문제일까요?

  • profile
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>

    이걸 빼보세요.
  • profile ?
    그걸빼면 top버튼이 작동안하네요.. ㅠㅠ
  • ? profile
    우선 jQuery 라이브러리는 아무거나 불러와서 쓰시면 안됩니다. 코어에서 불러오는것 만 쓰셔야 하고 다른것을 쓰시면 안됩니다.

    동작안되는건 XE에서 동작하게끔 스크립트 소스가 작성되지 않아서 일 것 입니다.


    $(function() 을

    jQuery(function($) 로 바꿔 보세요. 이렇게 해서 안된다면 다른 분이 답변을 주실 겁니다.
  • ? profile
    $(function() 을

    jQuery(function($)

    로 바꾸지 않아도 되는 최신버전 코어라면...


    안되는 이유가
    스크립트가 클릭하는 엘리먼트 보다 위쪽에 있어서 그럴 수 있겠습니다.
    <a id="MOVE_TOP_BTN" href="#"><img src="/img/up-arrow-icon.png" width="50px" height="50px"></a>

    를 스크립트 위쪽으로 옮겨보세요.
    아니면 스크립트를 페이지가 열린다음 동작되도록 고치는 방법도 있습니다.
  • profile
    이유는 모르지만....
    xe에 내장된 jquery는 jquery가 사용하는 대표적인 함수명인 "$"를 사용하지 못합니다.
    jquery를 사용해야 하죠.

    $(window).scroll(function() {
    ==>
    jquery(window).scroll(function() {
    이런식으로 해야 제대로 동작합니다.

    그래서 $로 만들어진 코드를 사용할때는
    jQuery(function($) {
    요기에 코드~~~ 블라 블라 블라~~
    });
    이렇게 하면 내부에 들어간 코드의 $가 jquery로 치환되면서 제대로 동작합니다.
  • profile profile
    XE 1.9.7부터는 $라고 쓸 수 있도록 바뀌었습니다.
    https://github.com/xpressengine/xe-core/pull/2262

    그런데 아직도 jQuery가 없는 줄 알고 제멋대로 다른 버전을 불러다 쓰는 서드파티 자료가 많아서... 그것 때문에 질문자분의 소스와 충돌하고 있을 수도 있습니다. 사이트를 보면 간단하게 알 수 있는 문제인데 주소 공개를 안 하셨으니;;
  • profile

    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>이건 지우시고
    스크립트부분을
    $(document).ready(function(){
    var st = $(window).scrollTop();
    if(st > 100){
    $('#MOVE_TOP_BTN').fadeIn();
    }
    else{
    $('#MOVE_TOP_BTN').fadeOut();
    }
    $("#MOVE_TOP_BTN").click(function() {
    $('html, body').animate({
    scrollTop : 0
    }, 400);
    return false;
    });
    });
    로 한번바꿔서 해보세요
    안되시면 window 부분을 this로 바꿔서도 해보시고요

  • ?

    댓글 달아주신분들 정말로 감사드립니다!
    해결했습니다!

     

    코드 위치가 좀 이상했네요..