JSFiddle - React, Tailwind, and code Playground
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>предмет 1</title>
<style>
.banner-1 {
position: fixed; /* Фиксированное положение */
left: 10px; /* Расстояние от левого края окна браузера */
top: 20%; /* Расстояние сверху */
padding: 2px; /* Поля вокруг */
display: none;
}
.content {height: 2000px;}
</style>
</head>
<body>
<div class="content"></div>
<div class="banner-1"><img src="/wp-content/uploads/2018/08/1_home-2.png" alt="Предмет 1"></div>
</body>
</html>
JavaScript
$(window).scroll (function(){
if($(this).scrollTop () > 100){
$('.banner-1').fadeIn ();
}else{
$('.banner-1').fadeOut ();
}
});