SIR
이전 목록 다음
채택완료

스크립트좀 봐주세요 ^^

sosososo
프로필 보기이 회원 글보기이 회원의 댓글보기
 2년 전 2,173

Copy 
<script>
            $().ready(function () {
                setTimeout(function()
             {
                     Swal.fire({
                     timer : 2000,
                     imageUrl: '/img/kakao.jpg',
                     imageHeight: 473,
                    imagemarginleft:  -47,

                });
             },2000);

        });

            </script>

 

 

 

현재 스크립트 작동은 잘 되고 있습니다.

 imageUrl: '/img/kakao.jpg'   팝업후에  이미지 클릭시 링크 되도록 하고싶은데,  잘 안되네요 ^^;

 

 

 

script
|

답변 3개 / 댓글 6개

채택된 답변
+20 포인트
웹웹메이킹
프로필 보기이 회원 글보기이 회원의 댓글보기
 2년 전

window.location.href = 'naver.com; 이 부분을 window.location.href = 'https://naver.com; 이렇게 수정을 해보시고 그래도 안되신다면 아래의 코드를 참고 해보세요

Copy 
$().ready(function() {
  setTimeout(function() {
    Swal.fire({
      timer: 2000,
      imageUrl: '/img/kakao.jpg',
      imageHeight: 473,
      imagemarginleft: -47,
      showConfirmButton: false, // 확인 버튼 숨김
      allowOutsideClick: true, // 외부 클릭 허용
    }).then(function(result) {
      if (result.isDismissed) {
        // 이미지 클릭 시 이동할 링크를 설정합니다.
        window.location.href = 'https://www.naver.com';
      }
    });
  }, 2000);
});

답변에 대한 댓글 3개

sosososo
프로필 보기이 회원 글보기이 회원의 댓글보기
 2년 전
window.location.href = 'naver.com; 이 부분을 window.location.href = 'https://naver.com; 이부분은 아까도 시도 해 보았던거구요.

아래걸로 해보니 2초후자동으로 이동되어지네요 ^^ ;
웹메이킹
프로필 보기이 회원 글보기이 회원의 댓글보기
 2년 전
바로 이동이 되게 하려면 allowOutsideClick 옵션을 true로 설정하여 외부 클릭을 활성화한 뒤, imageUrl에 클릭 이벤트를 추가하여 이미지를 클릭했을 때 바로 이동하도록 수정

이렇게 하면 되지 않을까 하는 생각입니다.
[code]
$().ready(function() {
setTimeout(function() {
Swal.fire({
timer: 2000,
imageUrl: '/img/kakao.jpg',
imageHeight: 473,
imagemarginleft: -47,
showConfirmButton: false, // 확인 버튼 숨김
allowOutsideClick: true, // 외부 클릭 활성화
}).then(function(result) {
if (result.isDismissed && result.dismiss === Swal.DismissReason.outside) {
// 이미지 클릭 시 이동할 링크를 설정합니다.
window.location.href = 'https://www.naver.com';
}
});

// 이미지 클릭 시 바로 이동하도록 설정합니다.
$('.swal2-image').click(function() {
window.location.href = 'https://www.naver.com';
});
}, 2000);
});
[/code]
sosososo
프로필 보기이 회원 글보기이 회원의 댓글보기
 2년 전
바쁜시간 감사 드립니다 ^^

<script>
$().ready(function() {
setTimeout(function() {
Swal.fire({
timer: 2000,
imageUrl: '/img/kakao.jpg',
allowOutsideClick: true, // 외부 클릭 활성화
}).then(function(result) {
if (result.isDismissed && result.dismiss === Swal.DismissReason.outside) {
// 이미지 클릭 시 이동할 링크를 설정합니다.
window.location.href = 'https://www.naver.com';
}
});

// 이미지 클릭 시 바로 이동하도록 설정합니다.
$('.swal2-image').click(function() {
window.location.href = 'https://www.naver.com';
});
}, 2000);
});
</script>


이렇게 해서 마무리 했습니다 ^^

마우스 올리면 마우스 포인트 까지 되면 좋겠습니다.

감사 드립니다.
웹웹메이킹
프로필 보기이 회원 글보기이 회원의 댓글보기
 2년 전

CSS의 cursor 속성을 사용하면 마우스를 올렸을때 커서를 표시하게 할 수 있습니다.

<script>태그 바로아래에 추가하시면 될 것 같습니다.

Copy 
$('.swal2-image').hover(function() {
  $(this).css('cursor', 'pointer');
});

답변에 대한 댓글 2개

sosososo
프로필 보기이 회원 글보기이 회원의 댓글보기
 2년 전
설명글까지 써 주시고, 감사 드립니다.
마우스는 좀더 공부 해 보겠습니다 ^^
sosososo
프로필 보기이 회원 글보기이 회원의 댓글보기
 2년 전
css cursor:pointer 줘서 해결 했습니다. 감사 드립니다 ^^

.swal2-image{cursor:pointer; }
웹웹메이킹
프로필 보기이 회원 글보기이 회원의 댓글보기
 2년 전

이미지 클릭시 링크를 연결하기 위해서 onImageClick 옵션을 사용해서 구현 할 수 있습니다

Copy 
$().ready(function() {
  setTimeout(function() {
    Swal.fire({
      timer: 2000,
      imageUrl: '/img/kakao.jpg',
      imageHeight: 473,
      imagemarginleft: -47,
      onImageClick: function() {
        // 이미지 클릭 시 이동할 링크를 설정합니다.
        window.location.href = '링크 주소';
      }
    });
  }, 2000);
});

위 코드를 참고하셔서 수정 하시면 원하시는 결과를 얻으실 수 있을것 같습니다.

링크주소 부분에는 이미지 클릭 시 이동하고자 하는 링크의 URL을 입력하시면 됩니다

답변에 대한 댓글 1개

sosososo
프로필 보기이 회원 글보기이 회원의 댓글보기
 2년 전
답변 감사 드립니다.
onImageClick: function() {
// 이미지 클릭 시 이동할 링크를 설정합니다.
window.location.href = 'naver.com;
}

추가 했는데 반응을 안하네요 ^^;

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