Mise en évidence panneau actif en CSS sans JavaScript

Question

Je construis quelque chose de similaire à ce - http: //www.impressivewebs.com/demo-files/content-switcher/content-switcher.html

Je me demandais si quelqu'un avait des idées quant à la façon dont je peux afficher le panneau en cours dans la navigation sans l'aide de JavaScript - CSS pur

.

Je suis assez confidente ce n'est pas possible, mais je pensais que je demande de toute façon.

Pour préciser ... Vous remarquerez que lorsque vous cliquez sur un lien sur cette page -

Était-ce utile?

Nous faire parvenir

La solution

Il est possible, croyez-le ou non, il est vraiment difficile. Cela devrait vous aider à démarrer: http: / /thinkvitamin.com/design/css/how-to-create-a-valid-non-javascript-lightbox/ La clé bit est capturée dans cette citation:

  

Je suis sûr que vous êtes tous au courant de se lier à un élément sur la même page avec l'utilisation de l'attribut ID et comment il fonctionne. Cependant, vous ne pouvez pas savoir que lier à un élément qui est caché hors de la page provoque l'élément à « tiré » en vue, par opposition à la sauter de la fenêtre vers le bas pour cet élément.

Donc, fondamentalement, vous mettiez toutes vos diapositives hors-page et ensuite les liens numérotés utilisent des ancres pour tirer ceux en vue. Votre cas d'utilisation devrait être un peu plus simple que celui qu'elle fait, puisque vous n'avez pas assombrir le reste de la page.

Answer 1

Il est possible, croyez-le ou non, il est vraiment difficile. Cela devrait vous aider à démarrer: http: / /thinkvitamin.com/design/css/how-to-create-a-valid-non-javascript-lightbox/ La clé bit est capturée dans cette citation:

  

Je suis sûr que vous êtes tous au courant de se lier à un élément sur la même page avec l'utilisation de l'attribut ID et comment il fonctionne. Cependant, vous ne pouvez pas savoir que lier à un élément qui est caché hors de la page provoque l'élément à « tiré » en vue, par opposition à la sauter de la fenêtre vers le bas pour cet élément.

Donc, fondamentalement, vous mettiez toutes vos diapositives hors-page et ensuite les liens numérotés utilisent des ancres pour tirer ceux en vue. Votre cas d'utilisation devrait être un peu plus simple que celui qu'elle fait, puisque vous n'avez pas assombrir le reste de la page.

Answer 2

Ce que vous devez faire est de mettre ce que vous devez faire glisser dans un conteneur avec une taille fixe et jeu de propriété « débordement » à caché. Puis, à l'intérieur de ce conteneur, vous mettez votre contenu « coulissant » dans une liste d'éléments d'ancrage avec l'ensemble « d'affichage » pour bloquer et la taille même du récipient. Si, à partir d'un lien sur la page, vous appelez l'un des points d'ancrage dans la liste, l'élément avec le nom d'ancrage correspondant sera affiché automgically .. simple que cela.