1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
1
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
2
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>V1Study: Tạo hiệu ứng Jump bằng jQuery (Animate the Jump using jQuery)</title>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script>
$(function() {
$(".jumper").on("click", function(){$("body, html").animate({scrollTop: $($(this).attr('href')).offset().top},600);});});
</script>
</head>
<body>
<a class="jumper" href="#v1study1">Heading 1</a>
<a class="jumper" href="#v1study2">Heading 2</a>
<h2 id="v1study1">Heading 1</h2>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<p>1</p>
<h2 id="v1study2">Heading 2</h2>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
<p>2</p>
</body>
</html>