переход webkit не исчезает, просто исчезает - PullRequest
Новая
       21

переход webkit не исчезает, просто исчезает

0 голосов
/ 06 марта 2012

У меня есть установка, где у меня есть три квадрата, первые два настроены на исчезновение при нажатии на третий. Когда вы нажимаете на это, что происходит, хотя первые два просто исчезают, не исчезают, я не могу понять почему, какие-либо мысли?

http://jsfiddle.net/6fSEz/

это скрипка и сам код: 

<html>
<head>
<style>
.box 
{     
    opacity:1;
    color: white;
    width: 100px;
    height: 100px;
} 

#box1
{
    background-color: green;
}

#box2
{
    background-color: red;
}

#box3
{
    background-color: blue;
}

.fadeAway1
{ 
    opacity:0;
    -webkit-transition-property: opacity; 
    -webkit-transition-duration: 2s; 
}  

.fadeAway2 
{ 
    opacity:0;
    -webkit-transition-property: opacity; 
    -webkit-transition-duration: 5s; 
}  
</style>
</head>

<body>
<div id="box1" class="box"></div>
<div id="box2" class="box"></div>
<div id="box3" onclick="box2.className='fadeway1';box1.className='fadeaway2';"   
class="box">Tap to fade</div>



</body>
</html>

Заранее спасибо за любую помощь.

1 Ответ

1 голос
/ 07 марта 2012

В функции щелчка вы удаляете стили, применяемые стилями класса ".box". Это удаляет ширину и высоту и т. Д. Кроме того, CSS и JavaScript чувствительны к регистру. Заглавные буквы между селекторами должны точно соответствовать атрибутам элемента.

Обновлен jsfiddle: jsfiddle.net / 6fSEz / 2 /

...