div>hover>active>а что после этого?

[pudge]

Есть блок-спойлер,который после прокликивания должен изменять свою форму:

.videoA{   display:block;   position:relative;   background-color:#191919;   border:solid 1px black;   border-radius:5px;   width:582px;   line-height:30px;   margin:15px auto 0px;   font-size:12pt;   padding:0px 10px;   box-sizing: border-box;   color:white;}.videoA:hover{   color:blue;}.videoA:active{   border-radius:5px 5px 0px 0px;}

Но вот проблемка,hover - это изменение во время наведения курсора на блок,active - изменение во время зажима этого блока курсором,мне ещё нужно что бы был ещё один режим который видеоизменял бы этот блок после того как его активировали и вылез скрытый текст спойлера,я сначала думал что будет работать вот так:

.videoA:active{   border-radius:5px 5px 0px 0px;}

Но потом вспомнил что блок меняет форму лишь когда зажимаешь его,а не после того как по нему клацнули.

 

З.Ы.visited не работает так как это по факту не ссылка,или хз чего ещё не работает вот если добавить:

 

.videoA:visited
{
border-radius:5px 5px 0px 0px;
}

 

Да и если бы работало то это не вариант был бы,ибо когда спойлер закрывали бы то его вид не изменялся бы к первоначальному...(

Edited November 19, 2013 by pudge

[3d_max_9]

не то сори 

Edited November 19, 2013 by 3d_max_9

[Z1gnet]

ну так через цсс такое никак не сделаешь. тут нужен джаваскрипт

$(".videoA").click(function () {      $(this).toggleClass("active");});

по клику будет добавляться на ссылку класс .active и на него пропишите стили. либо можно в джаваскрипте вместо класса стили применять, но я бы сделал через класс, как по мне так удобнее.

[pudge]

ну так через цсс такое никак не сделаешь. тут нужен джаваскрипт

$(".videoA").click(function () {      $(this).toggleClass("active");});

по клику будет добавляться на ссылку класс .active и на него пропишите стили. либо можно в джаваскрипте вместо класса стили применять, но я бы сделал через класс, как по мне так удобнее.

ничего не понял,сначала я просто добавил ваш скрипт сразу за своим(тупо встаил то что вы выложили),потом сделал вот так но тоже ничего не работает:

<script>$(".videoA").click(function (){      $(".videoJS").toggle();});</script><script>$(".videoA:active").click(function () {      $(.videoA:active).toggleClass("active");});</script>

[Z1gnet]

не знаю что вы там и куда вставляли, но вот вам готовый пример http://cssdeck.com/labs/xpfo5gav

все работает, возможно вы библиотеку джейквери не подключили?

 

 

$(".videoA:active").click(function () { $(.videoA:active).toggleClass("active"); });

это и не будет работать так как событие клик происходит до того как ссылка становиться и :active

Edited November 20, 2013 by Z1gnet

[pudge]

не знаю что вы там и куда вставляли, но вот вам готовый пример http://cssdeck.com/labs/xpfo5gav

все работает, возможно вы библиотеку джейквери не подключили?

 

 

$(".videoA:active").click(function () { $(.videoA:active).toggleClass("active"); });

это и не будет работать так как событие клик происходит до того как ссылка становиться и :active

 

 

ухты,теперь ясно спасибо!

 

Но вот ещё вопросик:как ваш скрипт

<script>$(".videoA").click(function () {      $(this).toggleClass("active");      return false;});</script>

впихнуть в мой

<script>$(".videoA").click(function () {      $(this).next(".videoJS").toggle();});</script>

Ну что бы место секономить,если нельзя то ладно,не так страшно.

[Z1gnet]

<script>$(".videoA").click(function () {      $(this).next(".videoJS").toggle();      $(this).toggleClass("active");      return false; //это что бы ссылка не кликалась});</script>

вот и всего то, хотя можно еще сократить

<script>$(".videoA").click(function () {      $(this).toggleClass("active").next(".videoJS").toggle();      return false; //это что бы ссылка не кликалась});</script>

Edited November 20, 2013 by Z1gnet

[pudge]

<script>$(".videoA").click(function () {      $(this).next(".videoJS").toggle();      $(this).toggleClass("active");      return false; //это что бы ссылка не кликалась});</script>

вот и всего то, хотя можно еще сократить

<script>$(".videoA").click(function () {      $(this).toggleClass("active").next(".videoJS").toggle();      return false; //это что бы ссылка не кликалась});</script>

 

во,спасибо