JQuery Fadeout, puis travail FADEIN mais l'effet vacillante

Question

J'ai ces deux ELU:

<ul actualpage="0" id="lastcompanieslist" hideable="true" upperpage="1"> 
    <li page="0" style="display: none;"><img src="/images/OrangeArrow.jpg">1</ 
    <li page="0" style="display: none;"><img src="/images/OrangeArrow.jpg">2</li> 
    <li page="0" style="display: none;"><img src="/images/OrangeArrow.jpg">3</li> 
    <li page="0" style="display: none;"><img src="/images/OrangeArrow.jpg">4</li> 
    <li page="0" style="display: none;"><img src="/images/OrangeArrow.jpg">5</li> 
    <li page="1" style="display: none;"><img src="/images/OrangeArrow.jpg">6</li> 
    <li page="1" style="display: none;"><img src="/images/OrangeArrow.jpg">7</li> 
</ul> 


<ul actualpage="0" id="lastmodifiedcompanies" hideable="true" upperpage="1"> 
    <li page="0" style="display: none;"><img src="/images/OrangeArrow.jpg">1</li> 
    <li page="0" style="display: none;"><img src="/images/OrangeArrow.jpg">2</li> 
    <li page="0" style="display: none;"><img src="/images/OrangeArrow.jpg">3</li> 
    <li page="0" style="display: none;"><img src="/images/OrangeArrow.jpg">4</li> 
    <li page="0" style="display: none;"><img src="/images/OrangeArrow.jpg">5</li> 
    <li page="1" style="display: none;"><img src="/images/OrangeArrow.jpg">6</li> 
    <li page="1" style="display: none;"><img src="/images/OrangeArrow.jpg">7</li> 
    <li page="1" style="display: none;"><img src="/images/OrangeArrow.jpg">8</li> 
    <li page="1" style="display: none;"><img src="/images/OrangeArrow.jpg">9</li> 
</ul> 

Voici mon code javascript qui est exécuté lorsque je clique sur le bouton:

function Paging(ul) 
{ 
    //ul is the jquery ul that should be paged 
    ul.find('li[page!=' + $($(this).parent()).attr('actualpage') + ']').fadeOut(500, 
    function() 
    { 
     ul.find('li[page=' + $($(this).parent()).attr('actualpage') + ']').fadeIn(500); 
    } 
); 
} 

Im essayant de fadeOut les éléments LI dépendant du numéro de page en cours (ce numéro est stocké dans l'attribut 'page_effective' de l'UL parent, et après la fin de ces éléments LI dont la page correspond à l'attribut page_page de l'UL parent.)

L'effet fonctionne mais avec scintillement, savez-vous pourquoi?

Merci d'avance.

Jose

Answer 1

pourrait être un manque de performance du navigateur, peut-on voir un exemple ou les informations sur le navigateur que vous Testet, si vous seulement été testé sur un, essayez une autre et permet de voir si elle vacille même sur les deux :)

éditer Maintenant je sais quel est le problème, vos images doivent être positionnées de manière absolue les unes sur les autres. Je suis sûr que c'est le problème. juste essayer d'ajouter position: relative à votre ul et position: absolute à votre li cela résoudra le problème j'espère

Answer 2

Avez-vous essayé de définir la largeur fixe pour les éléments li?
Peut-être que l'effet de scintillement est causé par le fait que javascript essaye d'imiter les dimensions des boîtes avec un ensemble de fonctions qui n'est parfois pas très précis.