des moyens Cpoyler css

Cпойлер средствами css

L'idée de cet article, sans attendre l'avènement de html5, faire spoiler "en cliquant sur" grâce à css et HTML.

Les tentatives antérieures ont été faites pour mettre en œuvre l'Internet grâce à cette pseudo - principalement par: mise au point, conduisant à conteneurs samoskrytiyu, avec perte de concentration.

La base de cette conception - pseudo: checked

idée Minimaliste est la suivante:

  / * CSS * / .spoiler> entrée + .box {display: none;  } .spoiler> Entrée: cochée + .box {display: block;  } 
Message dans le spoiler.

Comme vous pouvez le voir transformé le code cross-browser, en commençant par IE9, qui a déjà un pseudo «: vérifié» et se terminant avec les versions actuelles des autres navigateurs. Coglasno régime - est «la mise en œuvre pur» html css.

Lorsque vous essayez d'étendre l'action sur IE6-8, (ici, comme d'habitude pour les s, - la «pureté» réalisation est perdue), et nous connecter bibliothèque de pseudo Googley pour IE:



Code »danse c compatibilité cross-browser" * testé dans HP, Win7-8 *


 des moyens Cpoyler css 

Cacher Afficher
Lorem Ipsum est simplement faux texte de l'industrie de l'imprimerie et de la composition.

Inconvénients: dans IE6-7 - panneau de CHEKIT "vintage" mis en avant par la gauche de l'aileron; (Mais nous ne nous sommes pas fixé la tâche de soutenir les données Iyo dans les plans originaux.

PS: Le code vous permet de parcourir le contenu tout spoiler déconnecté java script, - a affirmé que lors de la navigation avec les anciens téléphones mobiles, anonymizer ou un pare - feu durs configurés.

DEMO