RealAdmin

Плагин jquery для показа и скрытия элементов по клику

Плагин jquery для показа и скрытия элементов по клику
Комментарии: 4

Небольшой jQuery плагин который позволяет организовать скрытие и показ элементов или блоков при клике на другой элемент.

  • Скрыть или показать элементы с классом «show-block».
  • Скрыть или показать элемент с id «block-3».
  1. Скачиваем плагин по следующей ссылке. Загружаем на сайт и подключаем, предварительно убедившись, что jquery библиотека так же подключена.

    <script type="text/javascript" src="https://code.jquery.com/jquery-latest.min.js"></script>
    <script type="text/javascript" src="/RealShowHide.js"></script>
    
  2. Определяемся с элементами, при клике на которые должны появляться те или иные блоки. Этим элементам присвоим общий класс, например «ShowElement» и пропишем аттрибут «data-element». В нём укажем, какие блоки показывать и скрывать при клике.

    <span class="ShowElement" data-element=".show-block">(Show/Hide elements with class=show-block)</span> | 
    <span class="ShowElement" data-element="#block-3">(Show/Hide element with id=block-3)</span>
        	
    <div class="show-block" style="display: none;">Block 1</div>
    <div class="show-block" style="display: none;">Block 2</div>
    <div id="block-3" style="display: none;">Block 3</div>
            	
    <script>
        $('.ShowElement').RealShowHide({'speed':'fast'});
    </script>
            

В качестве параметра плагину можно передать настройку скорости показа и скрытия блоков.

  • fast — быстро;
  • slow — медленно;
  • без параметра — мгновенно.
Темы:
Ещё интересное — 6
Комментарии —
  1. Сергей
    Сергей14 августа 2015, 13:09#
    Здравствуйте. Я попробовал прицепить этот плагин на div. Чтобы при нажатии на div Появлялся блок. Но у меня ничего не вышло. Если вешаешь на span все ок. Можно как-то это сделать?
    1. Andy Si14 августа 2015, 18:47#
      Да вообще плагину все равно какой элемент, у меня в примерах на div повешено. Так что дело в чём то другом. Либо неправильно на div повешен плагин, либо у div есть какие-то стили, которые ему мешают отображаться как тебе надо.
    2. Автор
      Автор23 сентября 2016, 09:46#
      вы чо издеваетесь такие детские плагины))
      Нужен плагин для складывая двух чисел. НА Jquery)
      1. Andy Si23 сентября 2016, 09:54#
        Сорри, только для вычитания есть)
      © REALADMIN.RU   2021 г.
      Страница сгенерирована: 0,1692 s | 6 mb.
      На каком уровне Вы играете в шахматы?
      О П Р О С