OnPage Charge afficher une phrase - masquer les autres

J'ai créé http://techavid.com/design/test3.html et lorsque vous chargez la page, vous voyez qu'il y a 3 images. L'image du soleil est focalisée (en couleur), tandis que les autres sont grisées jusqu'à ce qu'elles soient cliquées. C'est comme ça que ça devrait être pour les images.OnPage Charge afficher une phrase - masquer les autres

Sous chaque image, vous voyez une phrase 1er: Soleil, 2ème: Avion & 3ème: Nano, mais lorsque la page est chargée, vous voyez les trois phrases. Comment faire ainsi quand la page charge la première phrase sous l'image active (soleil) montre seulement et les autres ne montrent pas, ils montrent seulement quand cliqué (bien que cela fonctionne juste besoin de comprendre la charge de page seulement montrer "1st: Sun")?

merci :)

paul J.

Source

2010-06-06 Paul

Si vous mettiez les deux premiers liens dans un span (comme vous le faites avec les deux autres ensembles de liens), cela devrait fonctionner:

$('#popuptext span:not(:first) a').hide();

ressemblerait à quelque chose comme le HTML proposé ceci:

<div id="popuptext"> 
    <span class="suntext"> <!-- add this --> 
     <a href="#" rel="sun">1st:</a> 
     <a href="#" rel="sun">Sun</a> 
    </span> <!-- and this --> 
    <span class="planetext"> 
     <a href="#" rel="plane">2nd:</a> 
     <a href="#" rel="plane">Airplane</a> 
    </span> 
    <span class="nanotext"> 
     <a href="#" rel="nano">3rd:</a> 
     <a href="#" rel="nano">Nano</a> 
    </span> 
</div>

Modifier Désolé, je n'ai pas regardé votre code assez proche. Vous devez changer le sélecteur de #popuptext span:not(:first) à #popuptext span:not(:first) a, puis cela fonctionne correctement. Notez également mon commentaire ci-dessous.

Source

2010-06-06 21:02:31

Merci J'ai mis en place le techavid.com/design/test3.html ci-dessus, mais pense que j'ai raté quelque chose? – Paul

Déplacer '$ ('# popuptext span: not (: first)'). Hide();' en dehors du gestionnaire de clics, par ex. . Juste après '$ (document) .ready (function() {' –

hey merci ... j'ai utilisé une ancienne école fonction javascript document.onload = hideLayer; fonction hideLayer() { document.getElementById ("hidetext"). style.display = "aucun"; } thnx pour l'aide et la scolarité acclame – Paul

Votre code javaScript masque les éléments de la page en définissant leur style sur display: none.

Je suppose que le moyen le plus simple de masquer certains éléments par défaut est de les définir explicitement en modifiant le fichier HTML ou un fichier CSS.

Vous pouvez également essayer visibility: hidden qui n'affecte pas le flux de documents.

Source

2010-06-06 21:03:44

vous remercie, mais je ne suis pas sûr de ce que vous voulez dire? – Paul

La manière la plus simple est d'envelopper la phrase dans un élément qui lui est propre (par exemple) et d'en activer la visibilité en utilisant CSS. (et un peu de JavaScript).

Par exemple en supposant que les images sont dans un élément li avec des noms de classe ImageBox:

li.imageBox span.imageCaption { 
    /* set style options */ 
} 
li.imageBox.active span.imageCaption { 
    /* use different style options */ 
}

Source

2010-06-06 21:03:54 user268396

merci .. les images et le texte sont dans la perspective de l'utilisateur chercher à être tout en un, mais le mot "Sun", doit être son propre lien séparé de sorte que lorsque l'utilisateur clique sur le soleil, ils voient l'effet ci-dessous, cliquez sur le mot "Sun", qui, lorsqu'on clique dessus, amène l'utilisateur à une nouvelle URL. – Paul

$(document).ready(function(){ $(".planetext").hide(); $(".nanotext").hide(); }

Est-ce que vous demandez?

Source

2010-06-06 21:04:04 Will

Fermer .... même si je ne veux pas que planetext et nanotext restent toujours cachés seulement quand suntext montre les cacher et quand planetext est cliqué montrer planetext cacher seulement suntext et garder le nanotext caché. Merci :) – Paul

OnPage Charge afficher une phrase - masquer les autres

Répondre

Questions connexes