凸显CSS活动面板没有JavaScript

我建立与此类似 - http://www.impressivewebs.com/demo-files/content-switcher/content-switcher.html 凸显CSS活动面板没有JavaScript

如果任何人有任何想法，我不知道，我怎么能显示在导航中的当前面板而不使用JavaScript - 纯CSS。

我相当知情这是不可能的，但我想我会问无论如何。

只是为了澄清...
你会发现，当你点击这个页面上的链接 - http://www.impressivewebs.com/demo-files/content-switcher/content-switcher-javascript.html你只需点击亮点链接，告知他们正在寻找在该面板的用户。这就是我想在CSS中做的事情。

来源

2010-09-13 Sam

我不认为这是可能的没有CSS。无论如何，你将不得不告诉其中一个div显示，另一个隐藏.. – 2010-09-13 09:52:36

@Litso：如果你的意思是“没有JavaScript”而不是“没有CSS”，那么：不是这样！他链接的第一件事就是管理它，这个技巧在我回答中发布的链接中详细讨论。当我发现你可以在没有JavaScript的情况下做到这一点时，我感到非常震惊。 – 2010-09-13 09:57:30

我的意思是javascript ..我会检查出来的:) – 2010-09-13 10:02:38

这是可能的，不管你信不信，它只是非常棘手。这应该让你开始：http://thinkvitamin.com/design/css/how-to-create-a-valid-non-javascript-lightbox/的键位在此引用捕获：

我相信大家都知道链接的元素在同一页上使用的ID属性以及它是如何的作品。但是，您可能不知道链接到页面隐藏的元素会导致元素被“拉”到视图中，而不是跳到该元素的窗口。

所以基本上，你会把所有的幻灯片放在页面外，然后让编号的链接使用锚点将它们拉入视图。你的用例应该比她所做的更简单一些，因为你不必模糊页面的其余部分。

来源

2010-09-13 09:44:30

@Sam：你可以将东西的导航部分拉到视图中（因此第一个面板将包含导航，第一个导航链接为蓝色;第二个面板将包含第二个导航链接为蓝色的导航;等等）或者定位导航链接，以使面板内的内容进入视图可以指向它们（而不是突出显示它们）。（对不起，顺便说一句，我一开始并没有意识到你链接到的东西*仅是CSS。） – 2010-09-13 09:55:54

（上面的评论回复了Sam的评论，他现在已经被删除并且被折叠到他的问题中。） – 2010-09-13 09:58:22

J：谢谢，面板将被动态地创建，并且具有无限数量的实例，所以它可能有点沉重，导致很多导航实例。我会试一试！ – Sam 2010-09-13 09:59:16

-1

你需要做的是把你需要在固定大小的容器中滑动的内容和“溢出”属性设置为隐藏。然后，在此容器中，将“滑动”内容放置在“显示”设置为阻止和调整容器大小的锚元素列表中。如果从页面上的链接调用列表中的某个锚点，则具有相应锚点名称的元素将自动显示出来.. 简单。

来源

2010-09-13 10:31:38 Lucius

凸显CSS活动面板没有JavaScript

回答

相关问题