Задать вопрос
  • Как растянуть фоновое изображение под размер окна браузера?

    askandirov
    @askandirov
    Интересующийся
    background-size: cover или нужна ссылка на сайт
    Ответ написан
    Комментировать
  • Открыть/Закрыть блок при клике на нее, на другой блок и на любое свободное место?

    askandirov
    @askandirov Автор вопроса
    Интересующийся
    Решил таким образом:

    HTML:

    <!---- JB Block ---->
     <div class="job_page_block">
     <a href="#" class="open_jb_intextblock" title="Click to open more information"><div class="jobpage_block">
     <div class="jobpage_ico"><img src="/img/volunteer.png" class="jb_ico"></div>
     <div class="jobpage_block_descr">
     <div class="jobpage_block_descr">
     <p class="jb_toptext">Visible Block Title</p>
     <p class="jb_subtext">Visible Block Information</p>
     </div>
     <div class="clr"></div>
     </div></a>
     <div class="jb_intextblock" style="display:none;">Invisible information</div>
     </div>
    <!---- JB Block ---->
    
    <!---- JB Block ---->
     <div class="job_page_block">
     <a href="#" class="open_jb_intextblock" title="Click to open more information"><div class="jobpage_block">
     <div class="jobpage_ico"><img src="/img/volunteer.png" class="jb_ico"></div>
     <div class="jobpage_block_descr">
     <p class="jb_toptext">Visible Block Title</p>
     <p class="jb_subtext">Visible Block Information</p>
     </div>
     <div class="clr"></div>
     </div></a>
     <div class="jb_intextblock" style="display:none;">Invisible information</div>
     </div>
    <!---- JB Block ---->
    
    <!---- JB Block ---->
     <div class="job_page_block">
     <a href="#" class="open_jb_intextblock" title="Click to open more information"><div class="jobpage_block">
     <div class="jobpage_ico"><img src="/img/volunteer.png" class="jb_ico"></div>
     <div class="jobpage_block_descr">
     <p class="jb_toptext">Visible Block Title</p>
     <p class="jb_subtext">Visible Block Information</p>
     </div>
     <div class="clr"></div>
     </div></a>
     <div class="jb_intextblock" style="display:none;">Invisible information</div>
     </div>
     <!---- JB Block END ---->


    JS

    <script>
    $(function() {
        $('.open_jb_intextblock').on('click', function(e) {
            $('.jb_intextblock').slideUp('slow');
            if ( $(this).parent().find('.jb_intextblock').is(':visible') )
                $(this).parent().find('.jb_intextblock').slideUp('slow');
            else
                $(this).parent().find('.jb_intextblock').slideToggle('slow');
            e.preventDefault();
            e.stopPropagation();
        });
        $(document).on('click', function(){
            $('.jb_intextblock').slideUp('slow');
        });
    });
    </script>
    Ответ написан