JSFiddle - React, Tailwind, and code Playground
by Prasad Gavande
HTML
<!--------------------
grid scroller
---------------------->
<form id="form1" runat="server">
<div>
<div ID="dvScreenWidth" style="width: 600px; height: 400px; overflow: hidden;">
<asp:GridView ID="gvBusiness" runat="server"
ShowHeader="False" CellPadding="4" ForeColor="#333333" GridLines="None">
<AlternatingRowStyle BackColor="White" />
<Columns>
<asp:BoundField DataField="code" HeaderText="Code" />
<asp:BoundField DataField="name" HeaderText="Name" />
<asp:BoundField DataField="date_of_birth" HeaderText="Birth Date" />
<asp:BoundField DataField="date_of_joining" HeaderText="Joining Date" />
<asp:BoundField HeaderText="bl_type" />
</Columns>
<FooterStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#FFCC66" ForeColor="#333333" HorizontalAlign="Center" />
<RowStyle BackColor="#FFFBD6" ForeColor="#333333" />
<SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="Navy" />
<SortedAscendingCellStyle BackColor="#FDF5AC" />
<SortedAscendingHeaderStyle BackColor="#4D0000" />
<SortedDescendingCellStyle BackColor="#FCF6C0" />
<SortedDescendingHeaderStyle BackColor="#820000" />
</asp:GridView>
</div>
</div>
</form>
CSS
/*c# coding*/
/*
SqlConnection con = new SqlConnection(@"Data Source=PARA3KSAN03\SQL2008;Initial Catalog=BLIS;User ID=blis;Password=parablis");
con.Open();
SqlCommand cmd = new SqlCommand("select * from blis_business_leader", con);
SqlDataAdapter adapter = new SqlDataAdapter(cmd);
DataSet data = new DataSet();
adapter.Fill(data);
gvBusiness.DataSource = data;
gvBusiness.DataBind();
con.Close(); */
JavaScript
$(document).ready(function () {
$("#dvScreenWidth").mousemove(function () {
$(this).css("overflow", "auto");
$(this).scrollLeft(event.pageX);
$(this).scrollTop(event.pageY);
});
$("#dvScreenWidth").mouseleave(function () {
$(this).css("overflow", "hidden");
});
});