Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 17.04.2012, 04:53
Аватар для archcoffe
Интересующийся
Отправить личное сообщение для archcoffe Посмотреть профиль Найти все сообщения от archcoffe
 
Регистрация: 10.04.2012
Сообщений: 19

slideToggle(); - почти то же самое но все же
Вот и все! - нет не все, потому что смущает два номера:
1. Класс в <li> должен совпадать с названием блока таба, ибо не сработает
2. Осталось сделать переход к новому табу без сворачивания #main
я попробовал скрыть в диве #main все блоки которые не попадают в условие -
$('ul.tabse li').click(function(){
					var thisClass = this.className.slice(0,2);
					
					if( $('ul.tabse li').hasClass('tab-curre') ) {
						$('ul.tabse li').removeClass('tab-curre');
						$('div.' + thisClass).fadeOut();
						$('div#ololo').slideToggle();	
					}
					else {
						$('div#main div:not(.' + thisClass + ')' ).hide();
						$(this).addClass('tab-curre');
						$('div.' + thisClass).fadeIn();
						$('div#ololo').slideToggle();
					}
				});

похоже на правду наверно. Последнее что нужно допереть как сделать - при клике на не нажатую ранее ссылку(таб) оставить #main развернутым и отобразить блок не нажатого таба. Или свернуть #main затем снова развернуть и показать новый блок таба.

Последний раз редактировалось archcoffe, 18.04.2012 в 21:43.
Ответить с цитированием
  #12 (permalink)  
Старый 18.04.2012, 22:34
Аватар для archcoffe
Интересующийся
Отправить личное сообщение для archcoffe Посмотреть профиль Найти все сообщения от archcoffe
 
Регистрация: 10.04.2012
Сообщений: 19

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

Последний раз редактировалось archcoffe, 18.04.2012 в 22:54.
Ответить с цитированием
  #13 (permalink)  
Старый 19.04.2012, 23:52
Аватар для archcoffe
Интересующийся
Отправить личное сообщение для archcoffe Посмотреть профиль Найти все сообщения от archcoffe
 
Регистрация: 10.04.2012
Сообщений: 19

У меня получилось этого добиться добавляя "active" к классу самих блоков таба.
$(document).ready(function() {
				$('ul.tabse li').css('cursor', 'pointer');
				$('div.d2').hide();
				$('div.d1').hide();
				$('div#ololo').hide();
				$('ul.tabse li').click(function() {
					var thisClass = this.className.slice(0,2);
					if($('ul.tabse li').hasClass('tab-curre')) {
						if($('div#ololo div.' + thisClass).hasClass('active')) {
							$('div#ololo div.' + thisClass ).fadeOut();
							$('ul.tabse li').removeClass('tab-curre');
							$('div#ololo div.' + thisClass).removeClass('active');
							$('div#ololo').slideUp();
						}
						else {
							$('div#ololo div:not(.' + thisClass + ')' ).removeClass('active');
							$('div#ololo div.' + thisClass).addClass('active');
							$('ul.tabse li').removeClass('tab-curre');
							$(this).addClass('tab-curre');
							$('div.' + thisClass).fadeIn();
							$('div#ololo div:not(.' + thisClass + ')' ).hide();
							$('div#ololo').fadeIn(function () {
								$(this).toggle();
								$(this).show(350);
							});
						}
					}
					else {
						$('div#ololo div.' + thisClass).addClass('active');
						$(this).addClass('tab-curre');
						$('div.' + thisClass).fadeIn();
						$('div#ololo').slideDown();
					}
				});
				
			});

Однако потом поговорил с товарищем который что то понимает в этом - он мне по первой показал код в половину меньше этого, ругнулся мол "учи матчасть" и бросил замечание о том что у меня html не валидный.

Последний раз редактировалось archcoffe, 19.04.2012 в 23:56.
Ответить с цитированием
Ответ


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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Скрыть ссылку на js Googert Общие вопросы Javascript 10 21.02.2012 17:29
Меню, выпадающее и сворачивающееся не по hover а по клику adelante jQuery 1 14.01.2011 04:17