SOURCE

GC.Spread.Sheets.LicenseKey = "*.jsrun.cn|*.jsrun.net|jsrun.cn|jsrun.net,E265913768345242#A04NJMTM9UjNyIiOiQWSiwSflNHbhZmOiI7ckJye0ICbuFkI1pjIEJCLi4TPnFWcrFET7MmbiRkd5AlSElzVxdHZGZTQ5hzapR7arI7MlZGdtBVVZFHSxdURQlTWSBTVxkVcrd7dCdHVQtiWkJ4MKRzdLZFMEVHdvVWRxtkcwRFdxRkI0IyUiwCO9gjM7IDO5gTM0IicfJye#4Xfd5nIxcEMBJiOiMkIsICMx8idgMlSgQWYlJHcTJiOi8kI1tlOiQmcQJCLiUjM8QTMwACMycDM7EDMyIiOiQncDJCLiQXZu9ib5J7cqxibj9ib5J7cqxCdl9mLuVnczpmLqwibj9ib5J7cq9iKiojIz5GRiwiIuVnczpmI0ISYONkIsUWdyRnOiwmdFJCLiIDNyUZNdg"

    window.onload = function () {
        var spread1 = new GC.Spread.Sheets.Workbook(document.getElementById('s1'), { sheetCount: 1});
        var spread2 = new GC.Spread.Sheets.Workbook(document.getElementById('s2'), { sheetCount: 1});


        spread1.bind(GC.Spread.Sheets.Events.TopRowChanged, function (e, info) {  
            var sheetInSpread2 = spread2.getActiveSheet();  
            sheetInSpread2.showRow(info.newTopRow, GC.Spread.Sheets.VerticalPosition.top);
        });

        spread1.bind(GC.Spread.Sheets.Events.LeftColumnChanged, function (e, info) {   
            var sheetInSpread2 = spread2.getActiveSheet();   
            sheetInSpread2.showColumn(info.newLeftCol, GC.Spread.Sheets.HorizontalPosition.left);
        });



        spread2.bind(GC.Spread.Sheets.Events.TopRowChanged, function (e, info) {  
            var sheetInSpread1 = spread1.getActiveSheet();  
            sheetInSpread1.showRow(info.newTopRow, GC.Spread.Sheets.VerticalPosition.top);
        });

        spread2.bind(GC.Spread.Sheets.Events.LeftColumnChanged, function (e, info) {   
            var sheetInSpread1 = spread1.getActiveSheet();   
            sheetInSpread1.showColumn(info.newLeftCol, GC.Spread.Sheets.HorizontalPosition.left);
        });
    };

<div class="sample-turtorial">
  <div id="s1" class="harfLeft">
  </div>
  <div id="s2" class="harfLeft">
  </div>
</div>

html,
body {
  height: 100%
}

.harfLeft {
  width: 48%;
  height: 400px;
  border: 1px solid gray;
  float: left;
}