Красивый вертикальный скроллинг

 Вот так он будет выглядеть у вас на страничке сайта. Сверху и снизу тень при прокрутке, а до ходя до конца то одна тень пропадает, так как вы дошли до конца.

Вот сам код:

<style>
	.scrollbox {
	 overflow: auto;
	 width: 300px;
	 max-height: 300px;
	 margin: 30px auto;
	 background:
	  linear-gradient(white 30%, rgba(255,255,255,0)),
	  linear-gradient(rgba(255,255,255,0), white 70%) 0 100%,
	  radial-gradient(farthest-side at 50% 0, rgba(0,0,0,.2), rgba(0,0,0,0)),
	  radial-gradient(farthest-side at 50% 100%, rgba(0,0,0,.2), rgba(0,0,0,0)) 0 100%;
	 background-repeat: no-repeat;
	 background-size: 100% 40px, 100% 40px, 100% 14px, 100% 14px;
	 background-attachment: local, local, scroll, scroll;
	}
	</style>
	
	<div class="scrollbox">
	 <ul>
	  <li>Тени нет сверху.</li>
	  <li>2</li>
	  <li>3</li>
	  <li>4</li>
	  <li>5</li>
	  <li>6</li>
	  <li>Начинаем прокручивать блок</li>
	  <li>8</li>
	  <li>9</li>
	  <li>10</li>
	  <li>11</li>
	  <li>12</li>
	  <li>13</li>
	  <li>14</li>
	  <li>15</li>
	  <li>16</li>
	  <li>17</li>
	  <li>18</li>
	  <li>19</li>
	  <li>20</li>
	  <li>21</li>
	  <li>22</li>
	  <li>23</li>
	  <li>24</li>
	  <li>25</li>
	  <li>26</li>
	  <li>27</li>
	  <li>Конец!</li>
	  <li>Тут нет тени снизу.</li>
	 </ul>
	</div>

Вот и все. Удачи