Гость
Целевая тема:
Создать новую тему:
Автор:
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / алгоритм переключения на Jquery / 12 сообщений из 12, страница 1 из 1
30.01.2014, 12:01
    #38543337
-O_o-
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
алгоритм переключения на Jquery
Привет всем.
Я как бы новичок с этими технологиями и вообще новичок в программировании.
Сейчас делаю одну задачу, и у меня почему то не получается все засунуть в одну функцию.
Задача такая:
Хочу сделать меню из 2 разделов. По нажатию на каждый из них, должен выезжать слайд.
Код: html
1.
2.
3.
4.
5.
6.
7.
<div class="div_head">
   <div style="background-image:url('../img/logo.png'); height:40px; width:205px; float:left; margin-top:20px;"></div>
   <div id="arr1" class="div_menu" onClick="change_menu()"><span>Что это?</span></div>	
   <div id="arr2" class="div_menu" onClick="change_menu()"><span>О проекте</span></div>
</div>
    <div class="about"></div>
    <div class="project_info"></div>



Далее, пишу вот такую вот функцию:
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
function change_menu(){
	$('.div_menu').click(function(){
		if($(this).attr('id')==='arr2'){
				$('#arr2 span').css('background-color','red');
				$('.about').slideToggle('slow');
				$('.project_info').hide('slow');
			}else{
				$('#arr1 span').css('background-color','green');
				$('.project_info').slideToggle('slow');
				$('.about').hide('slow');
				};
		});
	};



Все работает, но блин криво. Нажимаю на одно меню и слайд начинает ездить 3 раза то прячется то появляется...
И я не могу понять почему...

Еще такой вопрос, правильно ли я делаю, что подключаю функцию создавая ее в другом файле и вешаю на событие онклик...
Получается у меня что, происходит типа 2 клика.... ???
Подскажите как правильно вообще работать с файлами для кода Jquery.

Спасибо.
...
Рейтинг: 0 / 0
30.01.2014, 12:29
    #38543384
Паганель
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
алгоритм переключения на Jquery
-O_o-
Код: javascript
1.
$('.div_menu').click(function(){

эта строчка навешивает обработчик на событие щелчка мышью по div_menu
...
Рейтинг: 0 / 0
30.01.2014, 12:39
    #38543405
-O_o-
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
алгоритм переключения на Jquery
Паганель-O_o-
Код: javascript
1.
$('.div_menu').click(function(){

эта строчка навешивает обработчик на событие щелчка мышью по div_menu
Это я знаю. Но вот вопрос, такой.
Когда я выношу скрипт в отдельный файл ХХХ.js то он не срабатывает когда я нажимаю на кнопку или еще какое событие... приходится функцией его запускать И не нашел ответ на такой элементарный вопрос, как правильно подключать файлы...
Хотя у меня он подключен
Код: html
1.
<SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript" SRC="../javascript/myJQ.js"></SCRIPT>
...
Рейтинг: 0 / 0
30.01.2014, 12:42
    #38543413
Паганель
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
алгоритм переключения на Jquery
-O_o-Когда я выношу скрипт в отдельный файл ХХХ.js то он не срабатывает когда я нажимаю на кнопку или еще какое событие... приходится функцией его запускатьнавешивайте обработчик в http://api.jquery.com/ready/ -O_o-И не нашел ответ на такой элементарный вопрос, как правильно подключать файлы...
Хотя у меня он подключен
Код: html
1.
<SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript" SRC="../javascript/myJQ.js"></SCRIPT>

убедитесь, что Вы его подключаете после подключения jQuery
...
Рейтинг: 0 / 0
30.01.2014, 13:02
    #38543471
-O_o-
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
алгоритм переключения на Jquery
Паганель,
авторубедитесь, что Вы его подключаете после подключения jQuery
А вот это уже интересно.
Подскажите как?
...
Рейтинг: 0 / 0
30.01.2014, 13:12
    #38543504
Паганель
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
алгоритм переключения на Jquery
ну как... у Вас ведь есть такой же тег <script> для подключения jQuery?
так вот он должен быть в документе раньше чем myJQ.js
...
Рейтинг: 0 / 0
30.01.2014, 13:51
    #38543594
-O_o-
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
алгоритм переключения на Jquery
Паганельну как... у Вас ведь есть такой же тег <script> для подключения jQuery?
так вот он должен быть в документе раньше чем myJQ.js
Да у меня в index.php есть в хэде
Код: html
1.
2.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>



Файл с функциями вынес в отдельный каталог и подключил. автор../javascript/myJQ.js
В самом фале myJQ.js нужно что-то еще дописывать???
Потому что если я там просто пишу функцию типа
Код: javascript
1.
2.
3.
4.
5.
$(document).ready(function(){
  $('div').click(function(){
     do something ....
     });
  });


То она даже не вызывается.... А вот если этот же код, но в тегах <script> на странице index.php поместить, то все клево работает...
...
Рейтинг: 0 / 0
30.01.2014, 13:58
    #38543606
Паганель
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
алгоритм переключения на Jquery
1) нажмите в браузере F12 и зайдите в консоль. Посмотрите, нет ли ошибок Javascript
2) перейдите на закладку Script, поставьте точки останова и поотлаживайте свой код.
как минимум убедитесь какие участки кода выполняются, а какие-нет
...
Рейтинг: 0 / 0
30.01.2014, 14:31
    #38543669
Програмёр
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
алгоритм переключения на Jquery
-O_o-,

какой-то путь странный "../javascript/myJQ.js"... За пределы DOCUMENT_ROOT что-ли вынесли?... напишите полный путь к этому js файлу и к index.php.
...
Рейтинг: 0 / 0
30.01.2014, 14:54
    #38543715
-O_o-
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
алгоритм переключения на Jquery
Програмёр,
Вот скрин.
а вот путь
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
<TITLE>WellSpeak.org</TITLE>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
  
  <link rel="stylesheet" href="../css/kickstart.css" media="all" /> <!-- KICKSTART -->
  <link rel="stylesheet" href="../css/myCSS.css" media="all" /> <!-- myCSS -->
  <SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript" SRC="../javascript/diff_match_patch.js"></SCRIPT>
  <SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript" SRC="/javascript/compare.js"></SCRIPT>
  <SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript" SRC="../javascript/kickstart.js"></SCRIPT>
  <SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript" SRC="../javascript/myJQ.js"></SCRIPT>
...
Рейтинг: 0 / 0
30.01.2014, 15:22
    #38543769
Програмёр
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
алгоритм переключения на Jquery
-O_o-Програмёр,
Вот скрин.
а вот путь
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
<TITLE>WellSpeak.org</TITLE>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
  
  <link rel="stylesheet" href="../css/kickstart.css" media="all" /> <!-- KICKSTART -->
  <link rel="stylesheet" href="../css/myCSS.css" media="all" /> <!-- myCSS -->
  <SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript" SRC="../javascript/diff_match_patch.js"></SCRIPT>
  <SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript" SRC="/javascript/compare.js"></SCRIPT>
  <SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript" SRC="../javascript/kickstart.js"></SCRIPT>
  <SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript" SRC="../javascript/myJQ.js"></SCRIPT>



Итак... Если Вы запускаете index.php, который видно в самом низу скрина, то путь, который Вы указали браузеру будет прочитан так: выйти на уровень выше (в ua-analizator.com), зайти в javascript и взять файл myJQ.js... Понимаете какой путь получается? "ua-analizator.com/javascript/myJQ.js"... почти уверен, что реально файл находится по пути "ua-analizator.com/test/javascript/myJQ.js".

P.S. Кстати... пути лучше указывать абсолютные (от корня сайта)... тогда и путаницы меньше, и работать всё точно будет :)
...
Рейтинг: 0 / 0
30.01.2014, 16:08
    #38543847
-O_o-
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
алгоритм переключения на Jquery
Програмёр-O_o-Програмёр,
Вот скрин.
а вот путь
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
<TITLE>WellSpeak.org</TITLE>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
  
  <link rel="stylesheet" href="../css/kickstart.css" media="all" /> <!-- KICKSTART -->
  <link rel="stylesheet" href="../css/myCSS.css" media="all" /> <!-- myCSS -->
  <SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript" SRC="../javascript/diff_match_patch.js"></SCRIPT>
  <SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript" SRC="/javascript/compare.js"></SCRIPT>
  <SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript" SRC="../javascript/kickstart.js"></SCRIPT>
  <SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript" SRC="../javascript/myJQ.js"></SCRIPT>



Итак... Если Вы запускаете index.php, который видно в самом низу скрина, то путь, который Вы указали браузеру будет прочитан так: выйти на уровень выше (в ua-analizator.com), зайти в javascript и взять файл myJQ.js... Понимаете какой путь получается? "ua-analizator.com/javascript/myJQ.js"... почти уверен, что реально файл находится по пути "ua-analizator.com/test/javascript/myJQ.js".

P.S. Кстати... пути лучше указывать абсолютные (от корня сайта)... тогда и путаницы меньше, и работать всё точно будет :)

Все заработало! О боги!! Спасибо.
...
Рейтинг: 0 / 0
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / алгоритм переключения на Jquery / 12 сообщений из 12, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]