<commit_before>---
title: Events
subTitle: API
nav: docs
description: Owl Carousel Documentation

sort: 3
tags:
- API
---

{{#markdown }}
## Events

> Events are provided by Owl Carousel in strategic code locations. This gives you the ability to listen for any changes and perform your own actions.

```
var owl = $('.owl-carousel');
owl.owlCarousel();

// Listen to owl events:
owl.on('changed.owl.carousel', function(event) {
	...
})

```

You could also trigger events by yourself to control Owl Carousel:

```
var owl = $('.owl-carousel');
owl.owlCarousel();

// Go to the next item
$('.customNextBtn').click(function() {
	owl.trigger('next.owl.carousel');
})

// Go to the previous item
$('.customPrevBtn').click(function() {
	// With optional speed parameter
	// Parameters has to be in square bracket '[]'
	owl.trigger('prev.owl.carousel', [300]);
})

```

### Callbacks

Instead of attaching an event handler you can also just add a callback to the options of Owl Carousel.

```
$('.owl-carousel').owlCarousel({
	onDragged: callback
});

function callback(event) {
	...
}
```

### Data

Each event passes very useful information within the [event object](http://api.jquery.com/category/events/event-object/). Based on the example above:

```Javascript
function callback(event) {
	var element   = event.target;    // DOM element, in this example .owl-carousel
	var data      = event.data;      // Data object contains status information
	var name      = event.type;      // Name of the event, in this example dragged
	var namespace = event.namespace; // Namespace of the event, in this example owl.carousel
}
```

### Events

{{#each events}}
#### {{name}}

Type: `{{type}}`<br />
{{#isnt callback undefined}}Callback: `{{callback}}`<br/>{{/isnt}}
{{#isnt param undefined}}Parameter: `{{param}}`<br/>{{/isnt}}

{{desc}}

------
{{/each}}

{{/markdown }}

<commit_msg>Fixes formating of optional event data<commit_after>---
title: Events
subTitle: API
nav: docs
description: Owl Carousel Documentation

sort: 3
tags:
- API
---

{{#markdown }}
## Events

> Events are provided by Owl Carousel in strategic code locations. This gives you the ability to listen for any changes and perform your own actions.

```
var owl = $('.owl-carousel');
owl.owlCarousel();

// Listen to owl events:
owl.on('changed.owl.carousel', function(event) {
	...
})

```

You could also trigger events by yourself to control Owl Carousel:

```
var owl = $('.owl-carousel');
owl.owlCarousel();

// Go to the next item
$('.customNextBtn').click(function() {
	owl.trigger('next.owl.carousel');
})

// Go to the previous item
$('.customPrevBtn').click(function() {
	// With optional speed parameter
	// Parameters has to be in square bracket '[]'
	owl.trigger('prev.owl.carousel', [300]);
})

```

### Callbacks

Instead of attaching an event handler you can also just add a callback to the options of Owl Carousel.

```
$('.owl-carousel').owlCarousel({
	onDragged: callback
});

function callback(event) {
	...
}
```

### Data

Each event passes very useful information within the [event object](http://api.jquery.com/category/events/event-object/). Based on the example above:

```Javascript
function callback(event) {
	var element   = event.target;    // DOM element, in this example .owl-carousel
	var data      = event.data;      // Data object contains status information
	var name      = event.type;      // Name of the event, in this example dragged
	var namespace = event.namespace; // Namespace of the event, in this example owl.carousel
}
```

### Events

{{#each events}}
#### {{name}}

Type: `{{type}}`<br />{{#isnt callback undefined}}Callback: `{{callback}}`<br/>{{/isnt}}{{#isnt param undefined}}Parameter: `{{param}}`<br/>{{/isnt}}

{{desc}}

------
{{/each}}

{{/markdown }}


{'fraction_non_alphanumeric': 0.1654733492442323, 'fraction_numerical': 0.0021214531954388757, 'mean_word_length': 3.835897435897436, 'pattern_counts': {'":': 0, '<': 9, '<?xml version=': 0, '>': 11, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1779112', 'n_tokens_mistral': 1232, 'n_tokens_neox': 1160, 'n_words': 390}