Slide (Animate) ListView Item from Right To Left on PageLoad using jQuery in ASP.Net

Hi nauna,

Check this example. Now please take its reference and correct your code.

HTML

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/jquery-ui.js"></script>
<link type="text/css" href="https://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/themes/blitzer/jquery-ui.css" />
<script type="text/javascript">
    $(function () {
        setTimeout(function () {
            $(".category").show('slide', { direction: 'right' }, 1500);
        }, 1000);
    });
</script>
<asp:ListView ID="ListView1" runat="server">
    <ItemTemplate>
        <div class="category" style="width: 100%; float: left; display: none;">
            <div style="width: 100%;">
                <asp:Label ID="Label3" runat="server" Text='<%# Eval("hasslider") %>' Visible="false"></asp:Label>
                <asp:Label ID="Label1" runat="server" Text='<%# Eval("categoryid") %>' Visible="false"></asp:Label>
                <asp:Label ID="Label5" runat="server" Text='<%# Eval("formtype") %>' Visible="false"></asp:Label>
                <asp:LinkButton ID="LinkButton9" runat="server" CommandName="getvalue" ClientIDMode="AutoID">
                    <asp:Image ID="Image1" runat="server" ImageUrl='<%# Eval("icon") %>' />
                    <h5 class="upp bold">
                        <asp:Label ID="Label4" runat="server" Text='<%# Eval("categoryname") %>'></asp:Label>
                    </h5>
                </asp:LinkButton>
            </div>
        </div>
    </ItemTemplate>
</asp:ListView>

Code

C#

protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        System.Data.DataTable dt = new System.Data.DataTable();
        dt.Columns.AddRange(new System.Data.DataColumn[] { 
                        new System.Data.DataColumn("hasslider", typeof(int)),
                        new System.Data.DataColumn("categoryid", typeof(int)),
                        new System.Data.DataColumn("formtype",typeof(string)),
                        new System.Data.DataColumn("icon",typeof(string)),
                        new System.Data.DataColumn("categoryname",typeof(string)) });
        dt.Rows.Add(1, 1, "Form Type 1", "~/Icons/A.png", "Category 1");
        dt.Rows.Add(2, 2, "Form Type 2", "~/Icons/P.png", "Category 2");
        ListView1.DataSource = dt;
        ListView1.DataBind();
    }
}

VB.Net

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    If Not Me.IsPostBack Then
        Dim dt As System.Data.DataTable = New System.Data.DataTable()
        dt.Columns.AddRange(New System.Data.DataColumn() {
                            New System.Data.DataColumn("hasslider", GetType(Integer)),
                            New System.Data.DataColumn("categoryid", GetType(Integer)),
                            New System.Data.DataColumn("formtype", GetType(String)),
                            New System.Data.DataColumn("icon", GetType(String)),
                            New System.Data.DataColumn("categoryname", GetType(String))})
        dt.Rows.Add(1, 1, "Form Type 1", "~/Icons/A.png", "Category 1")
        dt.Rows.Add(2, 2, "Form Type 2", "~/Icons/P.png", "Category 2")
        ListView1.DataSource = dt
        ListView1.DataBind()
    End If
End Sub

Screenshot