Disable slideshow when play video

I display in a slideshow a video and an image as my code show it and everything works well. the goal is to stop the slide show when the client clicks on play video. is there a possibility with a script please ?

<LayoutTemplate>
    <ul class='cycle-slideshow no-list-style margin-reset padding-reset' data-cycle-speed='1800' data-cycle-fx='fadeout' data-cycle-slides="li" id="home-slider">
       <asp:PlaceHolder ID="HomeSlide" runat="server" />
    </ul>
</LayoutTemplate>


<ItemTemplate>
<li>
      <video id='my-video' class='video-js' controls preload='auto' width='980' height='452' poster='MY_VIDEO_POSTER.jpg' data-setup='{}'>
      <source src='<%# Eval("VideoURL") %>' type='video/mp4'>
      </video>  
    </li>
    <li>
        <a id="forVideoOrImage" href="<%# Eval("Url") %>.html">
       <img src="<%# Eval("ImageURL") %>">   
        </a>                      
    </li>
</ItemTemplate>
<EmptyDataTemplate></EmptyDataTemplate>

Solution

I finally found it, we must add the attribute data-cycle-cmd to our tag <video>, so when the client click on play the slideshow paused

<video data-cycle-cmd="pause" id='my-video' class='video-js' controls preload='auto' width='980' height='452' poster='MY_VIDEO_POSTER.jpg' data-setup='{}'>

for more details :

http://jquery.malsup.com/cycle2/api/