Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 31.01.2014, 01:37
Новичок на форуме
Отправить личное сообщение для Roman-lev Посмотреть профиль Найти все сообщения от Roman-lev
 
Регистрация: 31.01.2014
Сообщений: 6

Знающие люди, помогите новичку!
Всем привет!

В общем у меня я думаю проблема для любого кто знает js не проблема.

Есть скрипт который показывает и скрывает див при наведении

<script>
$(function(){                      
   $('#fir').mouseover(function(){ 
     $('div.sec').slideToggle('slow');
	 $('div.sec').mouseout(function(){
      $('div.sec').slideToggle('slow');
   });
});
});
</script>


Проблема в том что если наводить быстро несколько раз это все атк и будет сворачиваться и разворачиваться много раз. Научите как правильно реализовать такое?
Ответить с цитированием
  #2 (permalink)  
Старый 31.01.2014, 02:16
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Roman-lev,
http://api.jquery.com/stop/
Ответить с цитированием
  #3 (permalink)  
Старый 31.01.2014, 02:25
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Roman-lev,
<!DOCTYPE HTML>

<html>

<head>
    <title>Untitled</title>
    <style type="text/css">
        .sec {
            display: none;
            height: 100px;
            background-color: #9932CC;
        }
        p {
            background-color: #00FF7F;
        }
    </style>
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>

    <script>
        $(function () {
            $('#fir').hover(function () {
                $('div.sec').stop().slideToggle('slow');

            });
        });
    </script>
</head>

<body>
    <p id="fir">1234567</p>
    <div class="sec">1234567</div>
</body>

</html>
Ответить с цитированием
  #4 (permalink)  
Старый 31.01.2014, 03:16
Новичок на форуме
Отправить личное сообщение для Roman-lev Посмотреть профиль Найти все сообщения от Roman-lev
 
Регистрация: 31.01.2014
Сообщений: 6

рони, Спасибо, а как сделать что бы если курсор находится на div.sec он же не сворачивался?
Ответить с цитированием
  #5 (permalink)  
Старый 31.01.2014, 03:33
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от Roman-lev
как сделать что бы если курсор находится на div.sec он же не сворачивался?
медитировать тут hover и элементы form
Ответить с цитированием
  #6 (permalink)  
Старый 31.01.2014, 13:42
Новичок на форуме
Отправить личное сообщение для Roman-lev Посмотреть профиль Найти все сообщения от Roman-lev
 
Регистрация: 31.01.2014
Сообщений: 6

рони,
странно, но не получается.. скопипастил код, подставил туда свои дивы и все равно он обратно уезжает когда мышку навожу(
Ответить с цитированием
  #7 (permalink)  
Старый 31.01.2014, 14:46
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Roman-lev,
где код?
Ответить с цитированием
  #8 (permalink)  
Старый 31.01.2014, 16:48
Новичок на форуме
Отправить личное сообщение для Roman-lev Посмотреть профиль Найти все сообщения от Roman-lev
 
Регистрация: 31.01.2014
Сообщений: 6

рони, вот)
<!DOCTYPE html>
<head>
<meta charset='UTF-8'>
<title></title>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script>
$(function () {
    var d = $("#catalog"),
        f = $("div.sec-container");
    d.mouseenter(function (event) {
        f.stop(true, true).slideDown("slow")
    }).mouseleave(function (event) {
        if ($(event.target).parents("div.sec-container").size()) return;
        f.stop(true, true).slideUp(300)
    })
});
  </script>
</head>

<body>
<style>
.sec-container {
	position:absolute;
	width:100%;
	height:47px;
	background-color:#000;	
	margin-top:9px;
	display:none;
}
.catalog-bar-container {
	position:relative;
	width:1280px;
	margin:0 auto;
}
.catalog-bar a {
	font-size:12px;
	color:#FFF;
}
.catalog-bar {
	position:absolute;
	right:0;
	margin-top:13px;
}

</style>
            <div class="sitebar">
            	<ul id="bar">
                    <li id="catalog"><a href="#">Каталог</a>
                    </li> 
                </ul>    
            </div>
        <div class="sec-container">
        	<div class="catalog-bar-container">
            	<div class="catalog-bar">
        		<a href="#">1</a>&nbsp;&nbsp;&nbsp;
                <span style="color:#ffde00;font-size:12px;">•</span>&nbsp;&nbsp;
        		<a href="#">2</a>&nbsp;&nbsp;&nbsp;
                <span style="color:#ffde00;font-size:12px;">•</span>&nbsp;&nbsp;
        		<a href="#">3</a>&nbsp;&nbsp;&nbsp;
                <span style="color:#ffde00;font-size:12px;">•</span>&nbsp;&nbsp;
        		<a href="#">4</a>&nbsp;&nbsp;&nbsp;
                <span style="color:#ffde00;font-size:12px;">•</span>&nbsp;&nbsp;
        		<a href="#">5</a>&nbsp;&nbsp;&nbsp;
                <span style="color:#ffde00;font-size:12px;">•</span>&nbsp;&nbsp;
        		<a href="#">6</a>&nbsp;&nbsp;&nbsp;
                <span style="color:#ffde00;font-size:12px;">•</span>&nbsp;&nbsp;
        		<a href="#">7</a>
                </div>
        	</div>
        </div>
        
	</div>
</body>
</html>
Ответить с цитированием
  #9 (permalink)  
Старый 01.02.2014, 12:51
Новичок на форуме
Отправить личное сообщение для Roman-lev Посмотреть профиль Найти все сообщения от Roman-lev
 
Регистрация: 31.01.2014
Сообщений: 6

рони, не будете мне больше помогать?
Ответить с цитированием
  #10 (permalink)  
Старый 01.02.2014, 12:54
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Roman-lev,
экий вы торопыга ... ждите отстоя пива после выходных
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Люди, помогите дилетанту! Как объеденить скрипты в один файл? patroklit Элементы интерфейса 3 04.12.2013 13:55
Помогите новичку! Анатолий Саратовцев Events/DOM/Window 7 04.08.2012 17:46
Люди помогите! Как отключить css для ОПЕРЫ МИНИ??? griha787 Элементы интерфейса 1 13.04.2011 20:10
Помогите новичку с выпадающим списком interest Элементы интерфейса 5 19.05.2010 13:15
Люди, ПОМОГИТЕ! Bel666 jQuery 11 27.04.2010 15:38