Блог

Я использую приведенный ниже скрипт для переключения открытия и закрытия divs по щелчку:

 (function ($) {
    $.fn.showHide = function (options) {

    //default vars for the plugin
        var defaults = {
            speed: 1000,
            easing: '',
            changeText: 0,
            showText: 'Show',
            hideText: 'Hide',

        };
        var options = $.extend(defaults, options);

        $(this).click(function () {
             // this var stores which button you've clicked
             var toggleClick = $(this);
             // this reads the rel attribute of the button to determine which div id to toggle
             var toggleDiv = $(this).attr('rel');
             // here we toggle show/hide the correct div at the right speed and using which easing effect
             $(toggleDiv).slideToggle(options.speed, options.easing, function() {
             // this only fires once the animation is completed
             if(options.changeText==1){
             $(toggleDiv).is(":visible") ? toggleClick.text(options.hideText) : toggleClick.text(options.showText);
             }
              });

          return false;

        });

    };
})(jQuery);
  

Каков наилучший способ автоматического закрытия любых открытых в данный момент divs перед открытием следующего (чтобы все не были открыты на странице — видна только ссылка, на которую нажата)

HTML ниже:

 <a href="#" class="show_hide" rel="#slidingDiv">View</a><br />
   <div id="slidingDiv" style="display:none;">
       Fill this space with really interesting content.
   </div>

<a href="#" class="show_hide" rel="#slidingDiv_2">View</a><br />
   <div id="slidingDiv_2" style="display:none;">
       Fill this space with really interesting content.
   </div> 
  

Я предполагаю, что это просто быстрая проверка перед запуском open, но пока не могу заставить ее работать.

Заранее большое спасибо!

Добавьте slidingDivs класс ко всем скользящим divs и просто вызовите:

 $(".slidingDivs").hide();
  

Я не думаю, что стоит беспокоиться только о скрытии видимых, просто скройте их все.

Это может быть полезно

  $(toggleDiv).siblings(".slidingDivs").hide();
 $(toggleDiv).toggle();
  

где переключение div определяется в вашем коде как

 var toggleDiv = $(this).attr('rel');
  

и просто добавьте класс «slidingDivs» в divs с идентификаторами «slidingDiv» и «slidingDiv_2»