2013-03-01 2 views
0

Я пытаюсь реализовать определенную часть на веб-сайте, которая переключается вниз, когда я нажимаю на ссылку, если переключатель уже находится на странице, тогда он закроет это и откроет этот выбранный ,Stop Toggle при нажатии на ссылку

Пожалуйста, обратитесь сюда: http://jsfiddle.net/r79Nu/3/

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

Вот код:

$('#nav a').click(function() { 
    var headerItem = $(this).attr('data-header'); 
    if ($('#header_container').is(':visible')) { 
     $('#header_container').slideUp(500, function() { 
      $('.header_item').hide(); 
      $('#'+headerItem).show(); 
      $('#header_container').slideToggle(500); 
     }); 
    } 
    else { 
     $('#'+headerItem).show(); 
     $('#header_container').slideToggle(500); 
    } 

}); 

Надеется, что это имеет смысл.

+0

Так что вы хотите это так, если ссылка уже была нажата в первый раз (и расширение происходит), вы не хотите какие-либо дополнительные клики, чтобы запечатать и reexpand элемента, который уже был открыт? Как только щелкнуть 'click_0' один раз, пусть он будет расширяться. Затем снова нажмите 'click_0', вы ничего не хотите? Если вы нажмете 'click_01', вы хотите, чтобы он вел себя так, как сейчас (закрытие, повторное открытие), да? – Walls

+0

@Walls Я хочу, чтобы иметь возможность щелкнуть по нему, он расширяется, и когда вы снова нажимаете на ссылку, она перестает расширяться. Надеюсь, это имеет смысл. Например: http://jsfiddle.net/r79Nu/1/ BUT с функциональность выше – Phorce

+0

, так что вы хотите, чтобы она напоминала стоп-переключатель? В вашем примере скрипта, когда 'click_0', а затем нажмите его снова очень быстро, остановите функцию сползания вниз? Поэтому вместо того, чтобы отображать весь блок текста, вы хотите, чтобы он останавливался и скрывал остальную часть этого текста (что не было показано, когда второй клик остановил слайд)? Итак, у вас будет всего 1-2 строки, а не полный 4 в вашем примере? – Walls

ответ

1

Я сделаю снимок по тому, что, я думаю, вы хотите. Опять же, ОЧЕНЬ неясно, какова желаемая функциональность. Это будет работать с первым щелчком, расширяющим правильный текст (заголовок 1 или 2), а затем на втором щелчке на это начальное место щелчка, он убирает крышку. Это скрывает показанные данные, поэтому, когда вы нажимаете 1, вы получаете данные 1 и наоборот с 2. Это правильная функциональность?

http://jsfiddle.net/r79Nu/23/

+0

Если это не то, что нужно, была небольшая настройка, которую я сделал, чтобы обрабатывать текст, отображаемый в странных ситуациях за неправильный элемент. http://jsfiddle.net/r79Nu/27/ - новая редакция. Сообщите мне, если это правильно или что-то отсутствует в функциональности. * пальцы скрещен * – Walls

+0

@ пользователь1326876 сделал это произведение ?! Похоже, это так, надеюсь, это то, что вы искали. – Walls

1

Добавить этот код, чтобы он не переключался, если он уже выбран.

$('#nav a').click(function() { 
    var headerItem = $(this).attr('data-header'); 
    if ($('#header_container #'+headerItem).is(':visible')) { 
     $('#header_container').slideUp(500); // or whatever method to make it disappear 
     return false; 
    } 
    .... rest of your code ... 
} 
+0

Эй, спасибо за ответ. Но, к сожалению, нет. Пожалуйста, смотрите: [link] (http://jsfiddle.net/r79Nu/12/) [/ link] – Phorce

+0

, если вы снова нажмете его снова и снова, он остается. Я думал, это то, чего ты хотел. Вы хотите обрабатывать быстрый клик? – allenhwkim

+0

Я хочу, чтобы он закрыл тумблер. Поэтому, когда вы нажмете его снова, «синий» скрывается, пока вы не нажмете на него снова, где это произойдет. – Phorce

Смежные вопросы