Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Логика в javascript (https://javascript.ru/forum/misc/44599-logika-v-javascript.html)

VladLes22 25.01.2014 17:52

Логика в javascript
 
Доброго времени суток. Возник такой вопрос: Нужно чтобы при наведении на блок (slidebox) курсором, появлялся(через opacity) другой блок (h2)вложенный в первоначальный, ну и естественно когда курсора на данном блоке нет то заголовок (opacity:0).
<div class="slideBox">
			<a href="#"><img src="../images/1.png"></img></a>
			<h2 class="title">Заголовок</h2>
			<div class="slideup">
				<div class="description">
				Под катом
				</div>
			</div>
		</div>


В чем допускаю ошибку ?
<script type="text/javascript">
$(document).ready(function() { if ($('.slideBox').hover(function())) {
              $('.title').hover(function() {
                $(this).stop().animate({
                   opacity: 1
                 }, 0);
                    }
					}
					else  function() {
               $(this).stop().animate({
                opacity: 0
                 }, 200);
              });
            });
</script>

Прошу помочь)))
ЗЫ. Через css не предлагать, не работает))

рони 25.01.2014 18:08

VladLes22,
:write:
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
.title, .slideup{
   opacity: 0;
}

  </style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script type="text/javascript">
$(document).ready(function() {


$('.slideBox').hover(function() {
              $('.title, .slideup', this).stop().animate({
                   opacity: 1
                 }, 1000);

                    },
                  function() {
              $('.title, .slideup', this).stop().animate({
                   opacity: 0
                 }, 1000);

                    })
              });

</script>

</head>

<body>
<div class="slideBox">
			<a href="#"><img src="../images/1.png"></img></a>
			<h2 class="title">Заголовок</h2>
			<div class="slideup">
				<div class="description">
				Под катом
				</div>
			</div>
		</div>

</body>

</html>

VladLes22 25.01.2014 18:14

Так, а если мне надо чтобы slidbox всегда был с opacity:1 ?

VladLes22 25.01.2014 18:20

Код вставил к сожалению не работает, чуток не понимаю почему в коде нету if и else ??

ruslan_mart 25.01.2014 18:25

Цитата:

Сообщение от VladLes22
ЗЫ. Через css не предлагать, не работает))

Всё заработает, если сделать правильно. ;)

VladLes22 25.01.2014 18:31

Ну если в css можно организовать что то типо if slidebox:hover, h2.title: active {opacity:0;} и не применяю opacity к slidebox то да было бы круто)

рони 25.01.2014 19:15

Цитата:

Сообщение от VladLes22
Так, а если мне надо чтобы slidbox всегда был с opacity:1 ?

у slidbox opacity никак не изменяется в коде
Цитата:

Сообщение от VladLes22
Код вставил к сожалению не работает, чуток не понимаю почему в коде нету if и else ??

а зачем if и ваш пример неработающий где?

VladLes22 25.01.2014 19:24

так сам пример не работает на странице сайта, про if уже понял, если вставляю ваш код javascript то при наведении курсора на блок (slideblox) ничего не происходит а выполняется только css

VladLes22 25.01.2014 19:26

И не совсем понятно почему вы затронули slideup он работает по css

рони 25.01.2014 19:50

VladLes22,
:-?


Часовой пояс GMT +3, время: 20:20.