wijpopup Step 2 of 3: Initializing the Widget

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

Complete the following step:

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

<script type="text/javascript">
    $(function () {
        $("#food").wijpopup({
        autoHide: true,
        showEffect: 'blind',
        hideEffect: 'blind'
        });
    });
    function popupbeside() {
        $("#food").wijpopup('show', {
            of: $('#Button1')
        });
    }
</script>

This script will initialize the widget and create a function indicating where the image will appear when the button is clicked.

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