Open FancyBox on Page Load using jQuery fancybox plugin in ASP.Net

Last Reply 9 months ago By dharmendr

Posted 9 months ago

My Question is i want to open fancybox on first time page load there i have put contain of Login so please guide me how can i do ? please  how does it this please mention all the step in answer.

Posted 9 months ago Modified on 9 months ago

Hi Rancho079,

Check the below sample and modify as per your requirement.

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.css" rel="stylesheet" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.pack.js" type="text/javascript"></script>
    <script>
        $(document).ready(function () {
            $.fancybox.open('#dvLogin');
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div id="dvLogin">
            <table>
                <tr>
                    <td>User Id:</td>
                    <td>
                        <input type="text" id="txtUserId" />
                    </td>
                </tr>
                <tr>
                    <td>Password:</td>
                    <td>
                        <input type="password" id="txtPassword" /></td>
                </tr>
                <tr>
                    <td colspan="2" align="center">
                        <input type="button" value="login" /></td>
                </tr>
            </table>
        </div>
    </form>
</body>
</html>

Demo