관리 메뉴

moozi

4/6 gallery01.html 본문

TIS_2018/응용sw2018_1기

4/6 gallery01.html

moozi 2018. 4. 6. 17:44

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Gallery</title>

    <script

    src="https://code.jquery.com/jquery-1.12.4.min.js"

    integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ="

    crossorigin="anonymous"></script>

    <style>

        #gallery{

            width:300px;

            height:200px;

        }

    </style>

    <script>

        $(document).ready(function(){

            var index=1;

            $("#btn1").click(function(){

                index++;

                $("#gallery").attr("src","img/pic0"+index+".jpg");

            });

            $("#btn2").click(function(){

                index--;

                 $("#gallery").attr("src","img/pic0"+index+".jpg");

            });

        });

    </script>

</head>

<body>

    <img id="gallery" src="img/pic01.jpg"><br>

    <input id="btn2" type="button" value="prev">

    <input id="btn1" type="button" value="next"><br>

</body>

</html>

'TIS_2018 > 응용sw2018_1기' 카테고리의 다른 글

jQuery mouseWheel 이벤트  (0) 2018.04.10
Oracle Explain Plan  (0) 2018.04.09
jQuery연습문제01  (0) 2018.04.06
4/6 layout11.html  (0) 2018.04.06
javascript연습문제03  (0) 2018.04.05
Comments