Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 18.12.2015, 11:59
Профессор
Отправить личное сообщение для Siend Посмотреть профиль Найти все сообщения от Siend
 
Регистрация: 04.02.2012
Сообщений: 196

Изменение родительского стиля и фокусе дочернего
Ребят, запутался в селекторах. Подскажите как реализовать следующую вещь (и можно ли это сделать):

<div class="a">
  <div class="b">
    <div class="c"></div>
    <div class="c"></div>
    <div class="c"></div>
  </div>
</div>


задача: при фокусе "с" менять стиль у "а".
.a .c:focus{
/*задаем стиль фокусного "с"*/
}


А есть ли конструкция позволяющая менять стиль у "а" при ".c:focus"? или только javascript?
Ответить с цитированием
  #2 (permalink)  
Старый 18.12.2015, 12:14
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Siend,
С дочернего на родительский с помощью css стиль не изменить, только скрипт. (если только margin:-XXpx, не вывести все элементы c за пределы b и а (т.е они их будут перекрывать) тогда фокус на a никак не сделать, кроме как ткнуть с
Тады просто прописываем а:focus{ поскольку он будет лишь через фокус на с
Можно сделать при этом псевдовидимость а и b, перекрыв их широкими бордерами с прозрачным цветом от блоков с

Последний раз редактировалось Deff, 18.12.2015 в 16:02.
Ответить с цитированием
  #3 (permalink)  
Старый 18.12.2015, 12:49
Профессор
Отправить личное сообщение для Siend Посмотреть профиль Найти все сообщения от Siend
 
Регистрация: 04.02.2012
Сообщений: 196

Спасибо, идею понял)

просто такая вот проблема возникла:
Есть выпадающий список, взят из примера (ссылка на пример). В примере при выборе пункта меню ничего не происходит, пока не кликнешь в сторону от меня, а я хочу добиться чтобы при нажатии на выпадающий пункт меню, все подменю скрывалось.
<ul class="menu">
	<li tabindex="0">
			<span class="helix_subfont">Выбранный пункт меню</span>
		<ul class="submenu helix helix_subfont">
			<li>Пункт меню</li>
			<li>Пункт меню</li>
			<li>Пункт меню</li>
		</ul>
	</li>
</ul>

.submenu {
  ...
  max-height: 0;
  pointer-events: none;
}

.menu > li:hover .submenu, .menu > li:focus .submenu {
  pointer-events: auto;
  max-height: 2000;
  ...
}


Я решил проблему на jquery:
$(".menu .submenu li").click(function(e) {
	$(".menu .submenu:hover").css({ "pointer-events": "none" });
});
$(".menu li").hover(function () {
	$(".menu .submenu").css({ "pointer-events": "auto" });
}, function () {});


Но решение на css было бы красивее и правильнее(
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Изменение стиля элементов в Chrome Герда Opera, Safari и др. 4 30.10.2015 18:34
Изменение стиля всех одинаковых классов при наведение(клике) dmitriy39reg jQuery 10 03.02.2015 14:27
Изменение css стиля utb jQuery 4 06.04.2012 08:31
Ответ из дочернего окна с отличны доменом от родительского aydar Events/DOM/Window 2 24.11.2010 18:01
Изменение стиля родительского элемента при :hover дочернего lanzs Элементы интерфейса 2 16.10.2010 13:28