Waterfall stream code, simplified version

Recently, I want to implement delayed data loading. I found a very good column on the internet, read the Masonry example, and wrote a very simple example myself.

View page.

@ {ViewBag. Title = "waterfall stream"; Layout = "~ /Views/Shared/_ Layout. cshtml ";} @ section header {<script src = "~ /Scripts/jquery-ui-1.8.24.min.js "> </script> <style type =" text/css ">. * {margin: 0px; padding: 0px;} body {margin-left: auto; margin-right: auto ;}. clearBoth {clear: both;} # bodyContent {width: 1400px; margin-left: auto; margin-right: auto;} # head {width: 100%; height: 50px; margin-bottom: 10px ;}# LefMenue {width: 20%; height: 500px; float: left ;}# RightContent {width: 75%; float: right; border: thin s Olid #333 ;}# Footer {margin-top: 10px; width: 100%; height: 40px ;}. greyBlock {border: thin solid #333; background-color: # CCC; width: 100% ;}. item {float: left; width: 230px; margin: 5px; border: 1px solid # CCC ;} </style >}< div id = "bodyContent"> <div id = "head" class = "GreyBlock">  

C # Server:

Public JsonResult GetData () {Random ro = new Random (); List <int> vListInt = new List <int> (); for (int I = 0; I <12; I ++) {vListInt. add (ro. next (400,500);} return Json (vListInt, JsonRequestBehavior. allowGet );}View Code