2026, 새로운 도약을 시작합니다.

클릭시 이미지 확대 팝업 채택완료

이미지를 background-image로 넣었습니다

Copy


확대 아이콘도 .x:before 로 넣었는데 아이콘을 누르면 이미지가 팝업으로 확대되고 싶습니다

**클래스는 예를 든거에요!

제이쿼리나 스크립트를 찾아봐도 영 감이 안잡힙니다....

저는 img 태그도 span을 따로 만들어서 하질않고 다 background-image로 넣기도했고,

:before 가상요소 선택자가 저게 맞는건지도 모르겠어서 도움 요청 합니다 ㅜㅜ

Copy
// 이미지 확대

$(function(){

    $( '.x:before' ).click(function(){

        $( '.img' ).clearQueue().animate({height:300,width:800,left:200,top:100})

    });

});

답변 1개

채택된 답변
+20 포인트

<!DOCTYPE html>

<html>

<head>

<meta charset="EUC-KR">

<title>이벤트 객체</title>

<style>

img{ width:140px; height:120px; }

</style>

<script src="../js/jQuery.js" type="text/javascript"></script>

<script type="text/javascript">

    var abc=0;

    $(function() {

        $('img').bind('click', function(event){  //one은 한번만 실행된다.(확대 한번.)

            var $target = $(this); // $(event.target);

            $target.width($target.width()*2);  // 나누기는 축소

            $target.height($target.height()*2);

            $target.unbind();  

        });

    });

</script>

</head>

<body>

<img src="../images/im18.jpg">

</body>

</html>

로그인 후 평가할 수 있습니다

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

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

로그인
🐛 버그신고