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(); }); |
$(".upload-video > a, .upload-slides > a").click(function () { $(".drop-block-wrap").hide() $(this).next(".drop-block-wrap").toggle(); }); Может так |
Работает. Спасибо за помощь.
Но появилась проблема. При повторном клике на ссылку, блок не закрывается. Блок закрывается, если нажать на другую ссылку. |
Тогда надо делать условие
if($(this).next(".drop-block-wrap").toggleClass("active")){ $(this).next(".drop-block-wrap").fadeIn( скорость, вызов ) }else{ $(this).next(".drop-block-wrap").fadeOut( скорость, вызов ) } Как то так (это в черне ) |
как вариант, можно фильтровать
$(".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(); }); |
Спасибо!
Отлично работает! Все как надо! |
Часовой пояс GMT +3, время: 09:50. |