자녀가 마우스를 올려 놓고 클릭했을 때 스타일 부모

나는 선택한 탭과 그 위에 마우스를 올려 놓은 탭에 클래스를 할당하는 탭 탐색 스크립트를 사용하고 있습니다. 내 특정 레이아웃에 대해 탭 함수가 각 li 내의 범위에서 작동해야합니다. 이자녀가 마우스를 올려 놓고 클릭했을 때 스타일 부모

<li class="tabs"><span class="selected">Tab one</span></li>

를 클릭 할 때 그리고 그것이 공중 선회 때 나는 부모 li의 배경을 변경해야

<li class="tabs"><span class="hover">Tab one</span></li> 
<li class="tabs"><span class="selected hover">Tab one</span></li>

이상

<li class="tabs tab1"><span>Tab one</span></li>

탭 스크립트는 범위에 클래스를 할당 할 때 span을 클릭하거나 넘어서 덮습니다. 스크립트를 변경하지 않고 스크립트를 작성하고 을 사용하지 않고 jQuery을 사용하는 것이 가장 이상적입니다. 나는 Javascript에 관해서 내가 오히려 문맹 인 것에 따라 어떤 도움이라도 매우 감사 할 것이다. 많은 감사합니다. http://jsfiddle.net/spirelli/3a69W/6/

내가 어쩌면 부모도 할당 '선택'또는 (이 시나리오가 포함에 대한 CSS) 클래스로 '호버'될 수 있다고 생각 :

여기에 전체 설정입니다. 그러나 더 명확한 옵션이있을 수 있습니까?

출처

2013-11-20 user1154435

li의 배경색을 변경 하시겠습니까? –

상위 CSS 셀렉터가 아직 없습니다. 자바 스크립트를 사용해야합니다. – j08691

나는 span 엘리먼트가 아니라 LI 엘리먼트에 클래스를 두는 것이 더 쉽다고 생각한다. – Jop

그럼 당신은 간단하게 할 수있는 :

.tabs:hover {background-image:url('http://jsfiddle.net/img/logo.png');}

또는 더 나은 대답 : 당신의 JS에서 단순히 변경 :

tabs: s.getElements('span'),

추가보다

tabs: s.getElements('.tabs'),

에 : 커서 : 포인터를 .tabs 님의 CSS에

http://jsfiddle.net/3a69W/9/

출처

2013-11-20 15:48:03

고마워,하지만 이건 내가 필요로하는 것이 아니고 내가 요구 한 것이 아니다. 'li'는 탭 트리거가 될 수 없으며, 이렇게해야 할 필요가있는 범위가 더 작습니다. 따라서 'span'입니다. 내가 필요로하는 것은'span' 밖의 영역을 스타일링해야한다는 것입니다. (레이아웃이 어떻게 배치 될 것인지에 따라 덧붙여서는 안됩니다.) – user1154435

왜 리가 관심없는 탭이 될 수 없습니까? –

다음 작동하는지 확인 :

[http://jsfiddle.net/ajays_jsfiddle/3a69W/13/][1]

변화는 모든 HTML, CSS와 JS에서 만들어집니다.

출처

2013-11-20 16:33:18 user3005791

자녀가 마우스를 올려 놓고 클릭했을 때 스타일 부모

답변

관련 문제