<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
</head>
<body>
<button id="btn1">투명도30%</button>
<button id="btn2">투명도100%</button>
<h1>제목</h1>
<script type="text/javascript">
$("#btn1").click(function() {
//$("h1").fadeOut(); 사라지기
$("h1").fadeTo(1000, 0.3); //1초안에 30% (밀리언초, 0~1 투명도)
});
$("#btn2").click(function() {
//$("h1").fadeIn(); 없어진거 다시 생김
$("h1").fadeTo(1000, 1);
});
</script>
</body>
</html>
'JQuery' 카테고리의 다른 글
| 211005_addClass,removeClass (0) | 2021.10.05 |
|---|---|
| 211005_fadeout,fadein (0) | 2021.10.05 |
| 211005_siblings (0) | 2021.10.05 |
| 211005_transform,hover,rocate,scale,translate (0) | 2021.10.05 |
| 211005_form,change,click (0) | 2021.10.05 |