Подсветка активной панели в 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. Так или иначе, вам нужно будет рассказать одному из divs, чтобы показать, а другое - скрыть. –

@ Litso: Если вы имели в виду «без JavaScript» вместо «без css», то: Не так! Первое, что он связывает с этим, и технику подробно обсуждают в ссылке, которую я опубликовал в своем ответе. Я был потрясен, когда узнал, что вы можете сделать это без JavaScript. –

Я имею в виду javascript .. Я проверю это :) –

Возможно, поверьте или нет, это просто очень сложно. Это поможет вам начать: http://thinkvitamin.com/design/css/how-to-create-a-valid-non-javascript-lightbox/ Ключ немного улавливается в этой цитате:

Я уверен, что вы все знаете ссылки на элемент на той же странице с использованием атрибута ID и как его работает. Тем не менее, возможно, вы не знали, что ссылка на элемент, который скрыт от страницы, заставляет элемент «вытягиваться» в поле зрения, а не перейти к этому элементу.

Итак, вы поместите все слайды вне страницы, а затем пронумеруйте ссылки, используя якоря, чтобы вытащить их на просмотр. Ваш случай использования должен быть немного проще, чем тот, который она делает, так как вам не нужно скрывать остальную часть страницы.

источник

2010-09-13 09:44:30

@Sam: вы могли бы сделать навигационную часть вещи, которая была выведена в поле зрения (и поэтому первая панель будет включать в себя навигацию с первой навигационной связью синий, второй панель будет включать в себя навигацию со второй синей навигационной связью и т. д.). Или позиционируйте свои навигационные ссылки таким образом, чтобы контент в панели, отображаемой в панели, мог указывать на них (а не выделять их). (И извините, кстати, я сначала не понял, что вещь, с которой вы связались *, была * CSS-only.) –

(Комментарий выше ответил на комментарий Сэма, который он теперь удалил и сложил в свой вопрос.) –

J: Спасибо, панели будут создаваться динамически с неограниченным количеством экземпляров, поэтому это может быть немного тяжело, делая много примеров навигации. Я попробую! – Sam

-1

Что вам нужно сделать, так это разместить то, что вам нужно, чтобы скользить внутри контейнера с фиксированным размером, а свойство переполнения - скрыто. Затем, внутри этого контейнера, вы помещаете свое «скользящее» содержимое внутри списка элементов привязки с «отображением», установленным для блокировки и размера того же самого контейнера. Если по ссылке на странице вы вызываете один из якорей в списке, элемент с соответствующим именем привязки будет автоматически отображаться. просто.

источник

2010-09-13 10:31:38 Lucius

Подсветка активной панели в CSS без JavaScript

ответ

Смежные вопросы