JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://daneden.github.io/animate.css/animate.min.css">
<header>
		<nav>
			<ul>
				<li>
					<a href='#about'>
						About
					</a>
				</li>
				<li>
					<a href='work.html'>
						Work
					</a>
				</li>
				<li>
					<a href='#services'>
						Services
					</a>
				</li>
				<li>
					<a href='#contact'>
						Contact
					</a>
				</li>
			</ul>
		</nav>
	</header>
	<div class="pkt">
		Hello World
		<div class="related-share-container">
			<h2>Bangladesh</h2>
			<h2>Bangladesh</h2>
			<h2>Bangladesh</h2>
		</div>
	</div>

CSS

header {
			background-color: white;
			border-bottom: 1px solid #eaeaea;
			/*  box-shadow: 1px 0 2px 1px rgba(0, 0, 0, 0.2);*/
			padding: .5em 0;
		}
		header h1 {
			display: none;
		}
		header ul {
			text-align: center;
		}
		header ul li {
			display: inline-block;
		}
		header ul li a {
			padding: 1.08em 0.3em;
			text-transform: uppercase;
			color: #01486b;
			font-size: .8em;
			font-weight: 300;
		}
		header ul li a:hover {
			color: #139ee3;
		}
		.padding
		{
			padding: 3.61em 0 0 0;
		}
		.pkt{
			position: relative;
			height: 1000px;
		}

h2{
    font-size:30px;
}

/* this is your css code */
		.related-share-container{
			display: none;
			position: fixed;
			left: 40px;
			bottom: 0px;
		}

JavaScript

$(window).scroll(function(e) {
			if ($(window).scrollTop() + $(window).height() > $(document).height() + $(window).height()) {
				$('.related-share-container').removeClass('rotateOutUpRight').addClass('animated rotateInUpLeft').show();
			} else {
				$('.related-share-container').removeClass('rotateInUpLeft').addClass('rotateOutUpRight');
			}
});