Header i box shadow

Pozdrav webmajstori,

Dal ko zna kako napraviti recimo imam na stranici fixiran bar i sad imam neki content i kad krenem skrolat prema dole da se na fixiranom baru pojavi box shadow cini mi se da tu opciju ima gmail

1.) Na (.scroll) pokazuje sjenu
2.) Na (.mouseleave) vrača na početno

Ako želiš da sjena ostane onda samo izbaci mouseleave funkciju.

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
	x=0;
	$(document).ready(function(){
	$('section').scroll(function(){
		$('section').css('box-shadow', '5px 5px 5px #888');
		$('section').mouseleave(function() {
		$("section").css('box-shadow', 'none');
		});
	  });
	});
</script>
	<style>
		section {height:100px; width:500px; overflow:scroll}
	</style>
</head>
<body>
<section>
	<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem</p>
	<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem</p>
	<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem</p>
	<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem</p>
	<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem</p>
</section>
</body>
</html>

Copyright © 2020 WM Forum - AboutContact - Sponsored by: Mydataknox & Webmaster.Ninja