Comment Firefox rend les liens

Question

Je voudrais juste partager certaines de mes observations sur la façon dont Firefox 3.5 sur Ubuntu Jaunty Jackalope rend HTML:

Je les entrées suivantes dans ma page JSP:

<a title="myLink" href="[some url]">link 1</a> 
<a title="myLink" href="[some url]">link 2</a> 
<a title="myLink" href="[some url]">link 3</a> 

<a title="myLink" class="hiddenLink" href="[some url]">link 4</a> 
<a title="myLink" class="hiddenLink" href="[some url]">link 5</a> 
<a title="myLink" class="hiddenLink" href="[some url]">link 6</a> 

<button>more links</button> 

Les les liens ci-dessus sont affichés sur Firefox en tant que:

Les liens 4 à 6 sont cachés.

lien 1 lien2 link3

J'attache javascript sur le bouton 'plus de liens' en utilisant jQuery:

$("a[href ^='myLink']:hidden").show(); 

pour afficher des liens 4 à 6 sur la page. Voici comment Firefox rend les liens si je clique sur le bouton « Liens »:

lien 1 lien2 link3
lien 4
lien 5
lien 6

Answer 1

Probablement parce que jQuery est définissant la propriété de style d'affichage afficher = "bloquer" par opposition à afficher = "en ligne" lorsque vous appelez show(). Essayez ceci:

$("a[href ^='myLink']:hidden").css('display', 'inline'); 

ou:

$("a[href ^='myLink']:hidden").removeClass(); 

Answer 2

C'est parce que .show() les transforme en blocs:

Cette fonction affiche les éléments correspondants sur la page quand ils sont cachés. En fait, il change le style d'affichage pour «bloquer». Cela peut causer des problèmes dans la mise en page de votre page, car il insère un saut de ligne avant et après l'élément, mais pour une utilisation générale, il est parfait. Pour une utilisation plus flexible s'il vous plaît jeter un oeil et la fonction .addClass() et .removeClass().

Je suggère de remplacer .show() par .removeClass('hiddenLink').

Ou est-ce que "hiddenLink" fait plus que simplement masquer les liens, et voulez-vous qu'ils soient différents de vos autres liens lorsqu'ils deviennent visibles?