SetInterval si ripete solo una volta. Come sistemarlo?

Question

Sto provando a circa ul si sposterà circa 40px in alto ogni secondo. Stavo provando molte soluzioni su StackOverflow, ma nulla ha aiutato.

Questo è il mio codice

setInterval(function() { 
 
    $("#ul_news").animate({ 
 
    marginTop: -40 
 
    }, 300); 
 
}, 1000);

#ul_news { 
 
    /*position: absolute; 
 
    top: 0; 
 
    left: 100px; 
 
    z-index: 20;*/ 
 
} 
 
#ul_news li { 
 
    z-index: 20; 
 
    color: black; 
 
    list-style: none; 
 
    padding-bottom: 50px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
 

 
    <ul id="ul_news"> 
 
    <li class="active">ahoj2</li> 
 
    <li class="non_active1">ahoj3</li> 
 
    <li class="non_active2">ahoj4</li> 
 
    <li class="non_active3">ahoj5</li> 
 
    </ul>

Answer 1

è necessario utilizzare -40 per -=40px o -=40. -40 sarà sufficiente impostare il margin-top come -40px, se si vuole diminuire allora avete bisogno di usare come -=40

setInterval(function() { 
 
    $("#ul_news").animate({ 
 
    marginTop: '-=40px' 
 
    }, 300); 
 
}, 1000);

#ul_news { 
 
    /*position: absolute; 
 
    top: 0; 
 
    left: 100px; 
 
    z-index: 20;*/ 
 
} 
 
#ul_news li { 
 
    z-index: 20; 
 
    color: black; 
 
    list-style: none; 
 
    padding-bottom: 50px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
 

 
    <ul id="ul_news"> 
 
    <li class="active">ahoj2</li> 
 
    <li class="non_active1">ahoj3</li> 
 
    <li class="non_active2">ahoj4</li> 
 
    <li class="non_active3">ahoj5</li> 
 
    </ul>

proprietà animati possono anche essere relativa. Se un valore viene fornito con una sequenza iniziale di caratteri + = o - =, il valore di destinazione viene calcolato aggiungendo o sottraendo il numero specificato dal valore corrente della proprietà.

Tratto da http://api.jquery.com/animate/#animation-properties