기존 alert 알림, 팝업창 변경하기

기존 alert 알림, 팝업창 변경하기(기록저장용)

https://sir.kr/g5_tip/10301

팝업창의 경우 클릭조건을 줘야하는 단점이 있지만, 트리거를 이용해서 해결했습니다.

 

이건 저의 해당 사항이기 때문에 나머지 분들도 좋은 방법으로 커스텀해서 사용하시면 됩니다.

 

저와 비슷한 작업을 원하시는 분들에 대한 자료 제공입니다. (큰 도움은... 안되지만요^^)

 

bbs/alert.php 으로 이동 합니다.

 

중간에 아래의 소스코드가 있는데요.

저는 이런식으로 변경하여 커스텀 알림을 띄우고 있습니다.

 

<script>
alert("<?php echo $msg; ?>");
//document.location.href = "<?php echo $url; ?>";
<?php if ($url) { ?>
document.location.replace("<?php echo str_replace('&', '&', $url); ?>");
<?php } else { ?>
//alert('history.back();');
history.back();
<?php } ?>
</script>

 

----------------------------------------

 

<div class="error_form">
    <a href="#" class="error_desk" id="error_desk" style="display:none"></a>
</div>

<script>
$(document).ready(function() {
    new jBox('Modal', {
        attach: $('#error_desk'),
        width: 'auto',
        title: '<span style="color:dodgerblue"><i class="fas fa-exclamation-circle"></i> 알림</span>',
        overlay: false,
        createOnInit: true,
        content: '<?php echo $msg; ?><br/><br/><span style="float:right;color:lightgray;font-size:12px">3초뒤 이전 페이지로 이동합니다.</span>',
        draggable: true,
        repositionOnOpen: false,
        repositionOnContent: false
    });
    $(".jBox-closeButton").jBox("Mouse", {
        content: "<span style='color:dodgerblue;font-size:12px'><i class='fab fa-gratipay'></i> 헬프데스크</span><br/>알림창을 닫으면 이전 페이지로 돌아갑니다."
    });
    $("#error_desk").trigger("click");
    $(".jBox-closeButton").click(function () {
        <?php if ($url) { ?>

            // 이전 페이지로만 돌아가게 history.back(); 만 이용
            // document.location.replace("<?php echo str_replace('&', '&', $url); ?>");
            history.back();
        <?php } else { ?>
            history.back();
        <?php } ?>
    });
    setTimeout(function() {
        history.back();
    }, 3000);
});
</script>

 

위와 같이 제가 사용하는 커스텀 알림은 아래의 사진같이 나오겠죠.

 

 

만약, 저 흰색 페이지 없이 본 페이지와 같이 보이게 할려면

 

bbs/alert.php 상단, 하단의 있는

include_once(G5_PATH.'/head.sub.php');

include_once(G5_PATH.'/tail.sub.php');

를 아래와 같이 변경하면 본 페이지 안으로 끌어올 수는 있습니다.

include_once('_head.php');

include_once('_tail.php');

 

다만, 그누보드가 bbs/alert.php으로 알림을 모두 보내기 때문에 전체 코어를 수정하기 보다는 위와 같은 방식으로 커스텀 하시면 그나마 수월 하실것 같습니다.