jquery slideDown jump

[danirota]

Ciao a tutti, sto utilizzando la funzione slideDown di jquery, e mi sono imbattuto nel "famoso" problema del jump...
quando richiamo la gunzione, prima di aprire il contenitore, fa uno scatto ... veramente fastidiosos da vedere...
ho cercato soluzioni in rete, ma non ho trovato nulal che mi servisse, per esempio molti dicono che basta dare la width al contenitore che deve apparire... ma questo non mi ha aiutato...
voi avete idee??

di seguito il mio codice

PHP

echo "<div class=\"singoloProdotto\">";
                        echo $value["titolo"];
                echo "<span class=\"descrizione\">";
                            
                            echo $value["descrizione"];
                            
               echo "</span>";
                              
                echo "</div>"; 

JAVASCRIPT

$('.singoloProdotto').click(function(){
            
            $(this).find('.descrizione').slideToggle('slow','easeInSine');
            
        });

CSS

.singoloProdotto span{
        display: block;
    }
    
    .singoloProdotto .descrizione{
        margin-top: 10px;
        height: auto;
        display: none;
        overflow: hidden;
        width: 270px;
    }

[Xinod]

e' quel margin-top,
prova a farlo diventare un padding di un ulteriore elemento annidato in "descrizione"

ciao

[danirota]

provato, ma non funziona

[danirota]

provato, ma non funziona

A nessuno è capitato?

[danirota]

probabilmente ho risolto...
anzichè usare un blocco come div o span (all'elemento che deve fare l'animazione), uso un p
quindi il codice sarà

echo "<div class=\"singoloProdotto\">";
                        echo $value["titolo"];
                echo "<p class=\"descrizione\">";
                            
                            echo $value["descrizione"];
                            
               echo "</p>";
                              
                echo "</div>"; 

e così funziona perfettamente!!!

Qualcuno sa durmi il perchè?

[cavicchiandrea]

Potrebbe essere perché lo span di natura ha display:inline mentre il p ha un display:block