Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 13.01.2012, 23:22
Аспирант
Отправить личное сообщение для bazilio2010 Посмотреть профиль Найти все сообщения от bazilio2010
 
Регистрация: 04.10.2011
Сообщений: 34

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

Вот участок с которым не могу разобраться,
var a = 0;

function up(el){
  var s = el;
  a += 0.1
  s.style.opacity= a;
  if(a<1)
  {
     setTimeout(up, 20);
  }
}

вот весь код

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Изменение прозрачности DIV при наведении мыши.</title>

<STYLE type="text/css">
.paretndiv {
width:700px;
height:150px;

-moz-opacity: 0.0; /* Mozilla 1.6 и ниже */
-khtml-opacity: 0.0; /* Konqueror 3.1, Safari 1.1 */
opacity: 0.0; /* CSS3 - Mozilla 1.7b +, Firefox 0.9 +, Safari 1.2+, Opera 9+ */


}
.textbox{
height:inherit;
display: table-cell;
vertical-align: middle;
font-size:36px;

}
.image{
float:left;
}
</STYLE>

<script language="javascript" type="text/javascript">




var a = 0;

function up(el){
  var s = el;
  a += 0.1
  s.style.opacity= a;
  if(a<1)
  {
     setTimeout(up, 20);
  }
}



function down(el){
el.style.opacity="0.0";

}
</script>
</head>
<body>
<div class="paretndiv" onclick="up(this)"  onMouseOut="down(this)"  id="item1">
<div class="image"><img src="1.jpg"></div><div class="textbox">Чашка кофе</div>
</div>
<div class="paretndiv"  onclick="up(this)"  onMouseOut="down(this)" id="item2">
<div class="image"><img src="2.jpg"></div><div class="textbox">Офисное кресло</div>
</div>
</body>
</html>

Заранее благодарю людей, которые откликнутся
Ответить с цитированием
  #2 (permalink)  
Старый 13.01.2012, 23:23
Профессор
Посмотреть профиль Найти все сообщения от Livaanderiamarum
 
Регистрация: 25.12.2011
Сообщений: 786

сетТаймаут вызывается через определенное время ОДИН РАЗ, ты кликнул, он подождал и вызвался.

Как сделать чтобы было как ты хочешь? не скажу потомоу что не в настроении. подожди пока кто нибудь другой ответит.... более адекватный чем я который не разговариваем там с собой.
Ответить с цитированием
  #3 (permalink)  
Старый 13.01.2012, 23:47
Аватар для poorking
prodigy
Отправить личное сообщение для poorking Посмотреть профиль Найти все сообщения от poorking
 
Регистрация: 01.11.2010
Сообщений: 503

bazilio2010,
потому что в up не передается el когда он ставится колбэком для таймера.

var a = 0;

function up(el) {
    var s = el;
    a += 0.1
    s.style.opacity = a;
    if (a < 1) {
       setTimeout(function () { up(el);}, 20);
    }
}


попробуйте так, здесь мы замыкаем el внутри колбэка для таймера, а потом с ним (el) вызываем up
__________________
readOnly

Последний раз редактировалось poorking, 13.01.2012 в 23:49.
Ответить с цитированием
  #4 (permalink)  
Старый 14.01.2012, 00:17
Аспирант
Отправить личное сообщение для bazilio2010 Посмотреть профиль Найти все сообщения от bazilio2010
 
Регистрация: 04.10.2011
Сообщений: 34

poorking Благодарю. Теперь стало понятно
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Помогите начинающему разобраться с setTimeout Rain Events/DOM/Window 6 09.08.2011 21:18
Не могу разобраться с url в $.ajax ShoN jQuery 3 16.12.2010 10:55
Функция проверки onDomReady. Не могу разобраться с кодом vandy3 Общие вопросы Javascript 6 08.11.2010 09:47
One Click Upload не могу разобраться a.graphics jQuery 0 06.09.2010 13:16
Не могу разобраться с туториалом mr.codec jQuery 0 23.03.2009 21:27