Widgets > wijcarousel > wijcarousel Tutorial > 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:
</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.
</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.