MVC5 Classic
wijcarousel Step 2 of 3: Initializing the Widget

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

Complete the following steps:

  1. After the closing </div> tag you added in the previous step, enter the following jQuery script to initialize the wijcarousel widget:
    <script id="scriptInit" type="text/javascript">
        $(document).ready(function () {
            $("#wijcarousel0").wijcarousel(
            {
                display: 1,
                showTimer: true,
                showPager: true,
                loop: true,
                pagerType: "dots",
                showContorlsOnHover: false
            }
            );
        });
    </script>
    

    This script will initialize the widget.

  2. After the closing </script> tag you added in the previous step, add the following markup to style the wijcarousel widget:
    <style type="text/css">
        #wijcarousel0
        {
            width: 750px;
            height: 300px;
        }
    </style>
    

    This markup will style the widget.

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

 

 


Copyright (c) GrapeCity, inc. All rights reserved.

Product Support Forum |  Documentation Feedback