niceaji · April 23, 2020 00:10
diff --git a/quiz5.md b/quiz5.md
diff --git a/기본.html b/기본.html
 <!DOCTYPE html>
 <html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>quiz6</title>
    <style>
      .box {
        position: absolute;
        left: 100px;
        top: 100px;
        width: 100px;
        height: 100px;
        background-color: #ddd;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .box1 {
        left: 300px;
      }
    </style>
  </head>
  <body>
    <div class="box">
      Drag me!
    </div>
    <div class="box box1">
      Drag me!
    </div>

    <ol>
      <li>박스를 누르면 드래그가 시작됩니다 (mousedown 이벤트)</li>
      <li>
        마우스가 눌린 상태로 마우스를 움직이면 박스가 마우스 커서를 따라
        움직입니다 (mousemove 이벤트)
      </li>
      <li>클릭을 해제하면 드래그가 멈춥니다 (mouseup 이벤트)</li>
      <li>
        박스가 여러개이므로 함수가 코드 재활용이 잘 되도록 작성 해야 합니다
      </li>
    </ol>
    <script src="quiz5.js"></script>
  </body>
 </html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<title>quiz6</title>
	<style>
	.box {
	position: absolute;
	left: 100px;
	top: 100px;
	width: 100px;
	height: 100px;
	background-color: #ddd;
	display: flex;
	align-items: center;
	justify-content: center;
	}
	.box1 {
	left: 300px;
	}
	</style>
	</head>
	<body>
	<div class="box">
	Drag me!
	</div>
	<div class="box box1">
	Drag me!
	</div>

	<ol>
	<li>박스를 누르면 드래그가 시작됩니다 (mousedown 이벤트)</li>
	<li>
	마우스가 눌린 상태로 마우스를 움직이면 박스가 마우스 커서를 따라
	움직입니다 (mousemove 이벤트)
	</li>
	<li>클릭을 해제하면 드래그가 멈춥니다 (mouseup 이벤트)</li>
	<li>
	박스가 여러개이므로 함수가 코드 재활용이 잘 되도록 작성 해야 합니다
	</li>
	</ol>
	<script src="quiz5.js"></script>
	</body>
	</html>