wijgallery Step 2 of 3: Initializing the Widget

In the previous step, you added markup to add the content that will appear in the gallery. In this step, you'll add the jQuery script needed to initialize the widget.

Complete the following steps:

After the closing </div> tag you added in the previous step, enter the following jQuery script to initialize the wijgallery widget:

    <script id="scriptInit" type="text/javascript">
        $(document).ready(function () {
            $("#wijgallery").wijgallery({
                showControlsOnHover: true,
                thumbsDisplay: 4,
                thumbsLength: 150,
                showPager: false
            });
            $("#btn1").click(function () {
                $("#wijgallery").wijgallery("option", "disabled", false);
            });
        });
    </script>

This script will initialize the widget.

After the closing </script> tag you added in the previous step, add the following markup to style the wijgallery widget:
```
    <style type="text/css">
        #wijgallery
        {
            width: 750px;
        }
    </style>
```
This markup will style the widget.

You have created an application and added and initialized the wijgallery widget. In the next step, in wijgallery Step 3 of 3: Running the Project, you'll view the run-time interactions of the widget.