Function is only running once JQuery

254
January 10, 2018, at 05:21 AM

My function is only running once. It contains only css.

I'm trying to put this on the Materialize Slide. I have the following JQuery code. He are simple.

Editing. Placing the html list that is the slide, and showing the order of the item. I need slide one to be animated whenever the function is called

$(window).on('load resize', function(){ 
    var slideDivider = $('.slider .divider-cap')
    var sliderList = $('.slider ul li:eq(0)')   
    if(sliderList.hasClass('active'))
    {
        slideDivider.addClass('divider')    
    }
    else
    {
        slideDivider.removeClass('divider')
    }
});

CSS

.section-slide .slider .top-setting .divider {
      width: 600px;
      margin: auto;
      animation: dividerAnim 1s 1;
  }
@-webkit-keyframes dividerAnim {
    0%   {width: 0px;}
    100% {top: 600px;}
}
@keyframes dividerAnim {
    0%   {width: 0px}
    100% {width: 600px;}
}

HTML

<ul class="slides">
    <li>
        <img src="img/music10.jpeg" class="responsive-img"> 
        <div class="caption center-align top-setting">
            <h3>Test1</h3>
            <div class="divider-cap"></div>
            <h5 class="light grey-text text-lighten-3">block 1</h5>
        </div>
    </li>
    <li>
        <img src="img/music9.jpeg" class="responsive-img"> 
        <div class="caption left-align">
          <h3>Left</h3>
          <h5 class="light grey-text text-lighten-3">block 2</h5>
        </div>
    </li>
    <li>
        <img src="img/music4.jpg" class="responsive-img"> 
        <div class="caption right-align right-setting">
          <h3>Right</h3>
          <h5 class="light grey-text text-lighten-3">block 3</h5>
        </div>
    </li>
    <li>
        <img src="img/music12.jpeg" class="responsive-img"> 
        <div class="caption center-align">
          <h3>Center</h3>
          <h5 class="light grey-text text-lighten-3">block 4</h5>
        </div>
    </li>
</ul>

Rent Charter Buses Company
READ ALSO
Value of input is set but not visible Kendo Grid

Value of input is set but not visible Kendo Grid

I'm building a custom kendo grid, in which I need to validate some special chars when editing a rowI'm at the point where I can get the value of the input and then remove all non-accepted chars and set the new string to the input

307
Chunk uploading directly to s3 jquery-file-upload, only last chunk is saved

Chunk uploading directly to s3 jquery-file-upload, only last chunk is saved

I use jquery-file-upload plugin for uploading files to AWS S3 directly from JS client codeI used multipart upload

266
Perform Lazy Loading Client Side

Perform Lazy Loading Client Side

My question is about making lazy loading client side

260
How do I implement external JSON file with DustJS Templates

How do I implement external JSON file with DustJS Templates

I am having trouble understanding how to get DustJS to work on my siteI was, for the most part, successful in using handlebarsJS

248