Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 28.08.2014, 13:20
Интересующийся
Отправить личное сообщение для arborik Посмотреть профиль Найти все сообщения от arborik
 
Регистрация: 21.07.2014
Сообщений: 17

Toggle only single element
Всем привет.
Есть 2 ссылки при клике на них, должны открываться блоки.
Проблема в том, что при клике на каждую из ссылок, открывается 2 блока.
Нужно, если один блок открытый и мы кликаем на другую ссылку, второй блок открывается, а первый закрывается.
Видимый может быть только один блок.
Как решить эту задачу? В какую сторону смотреть?
Спасибо!
<div class="uploads-button">
			<div class="upload-slides">
				<a>UPLOAD SLIDES ></a>
				<div class="drop-block-wrap">
					<div class="drop-block">
						<p>Save presentation as JPEG or PNG. Drag and drop all slides here, or</p>
						<button>ADD SLIDES</button>
						<p>Once all slides are added, press upload.</p>
					</div>
					<div class="buttons">
						<button disabled="disabled">UPLOAD</button>
						<button disabled="disabled">CANCEL</button>
					</div>
				</div>
			</div>
			<div class="upload-video">
				<a>UPLOAD VIDEO ></a>
				<div class="drop-block-wrap">
					<div class="drop-block">
						<p>Drag and drop<br>video here, or</p>
						<button>ADD SLIDES</button>
					</div>
					<div class="buttons">
						<button disabled="disabled">UPLOAD</button>
						<button disabled="disabled">CANCEL</button>
					</div>
				</div>
			</div>
		</div>


$(".upload-video > a, .upload-slides > a").click(function () {
	$(this).next(".drop-block-wrap").toggle();
});
Ответить с цитированием
  #2 (permalink)  
Старый 28.08.2014, 13:53
Интересующийся
Отправить личное сообщение для -=1100=- Посмотреть профиль Найти все сообщения от -=1100=-
 
Регистрация: 07.09.2009
Сообщений: 26

$(".upload-video > a, .upload-slides > a").click(function () {
   $(".drop-block-wrap").hide()
    $(this).next(".drop-block-wrap").toggle();
});


Может так
Ответить с цитированием
  #3 (permalink)  
Старый 28.08.2014, 14:02
Интересующийся
Отправить личное сообщение для arborik Посмотреть профиль Найти все сообщения от arborik
 
Регистрация: 21.07.2014
Сообщений: 17

Работает. Спасибо за помощь.
Но появилась проблема.
При повторном клике на ссылку, блок не закрывается.
Блок закрывается, если нажать на другую ссылку.
Ответить с цитированием
  #4 (permalink)  
Старый 28.08.2014, 14:25
Интересующийся
Отправить личное сообщение для -=1100=- Посмотреть профиль Найти все сообщения от -=1100=-
 
Регистрация: 07.09.2009
Сообщений: 26

Тогда надо делать условие
if($(this).next(".drop-block-wrap").toggleClass("active")){
$(this).next(".drop-block-wrap").fadeIn( скорость, вызов )
}else{
$(this).next(".drop-block-wrap").fadeOut( скорость, вызов )
}

Как то так (это в черне )
Ответить с цитированием
  #5 (permalink)  
Старый 28.08.2014, 14:36
Аватар для BETEPAH
Профессор
Отправить личное сообщение для BETEPAH Посмотреть профиль Найти все сообщения от BETEPAH
 
Регистрация: 23.06.2011
Сообщений: 1,165

как вариант, можно фильтровать
$(".upload-video > a, .upload-slides > a").click(function (e) {
    var wrap = $(this).next(".drop-block-wrap")[0];
    $(".drop-block-wrap").filter(function() {return this !== wrap}).hide();
    $(this).next(".drop-block-wrap").toggle();
});
Ответить с цитированием
  #6 (permalink)  
Старый 28.08.2014, 16:47
Интересующийся
Отправить личное сообщение для arborik Посмотреть профиль Найти все сообщения от arborik
 
Регистрация: 21.07.2014
Сообщений: 17

Спасибо!
Отлично работает! Все как надо!
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Подскажите как лучше положить .xml документ в базу Гробовщик Серверные языки и технологии 4 02.09.2013 11:15
Получить координаты курсора в текстовом поле в пикселях prike Events/DOM/Window 4 23.05.2013 04:35
HTML 5. Выбор стратегии...(JS? JQ?) Mike_Kharkov (X)HTML/CSS 20 31.07.2012 15:26
Скроллинг клавишами и липкие блоки bes Общие вопросы Javascript 11 12.06.2012 22:08
Проблема в работе с тегами html zeraid Общие вопросы Javascript 16 11.05.2011 18:23