AnfisaMu

При наведении на блок он поворачивается под углом

Recommended Posts

Буду признательна если поможете

При наведении на блок он поворачивается под углом, при клике на блок - открывается сам блок на весь экран (плавно), при клике на лого - сворачивается открывшийся блок

Снимок экрана 2019-03-11 в 17.15.51.png

Share this post


Link to post
Share on other sites

 

11.03.2019 в 17:24, AnfisaMu сказал:

При наведении на блок он поворачивается под углом,

это использование hover эфекта, c применением свойства transform rotate

#element:hover{

transform:rotate  (50deg);

}

11.03.2019 в 17:24, AnfisaMu сказал:

при клике на блок - открывается сам блок на весь экран (плавно), при клике на лого - сворачивается открывшийся блок

здесь лучше всего написать скриптик на js

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By daggi
      Всем привет.
      При клике (добавляю active к label) делает активными все элементы, а не текущий? Как быть?
       
      $(document).on('change', '.compare-control', function(){ var id = $(this).val(); var url = '/?action=DELETE_FROM_COMPARE_LIST&ajax_action=Y&id='+id; if ($(this).prop('checked')) { url = '/?action=ADD_TO_COMPARE_LIST&ajax_action=Y&id='+id; } $.get(url, function() { BX.onCustomEvent('OnCompareChange'); }); // здесь беда!!!при клике на элемент, делает элементы все активными, а не текущий. if($('.catalog-content-main-item-top-fav').hasClass('active')) { $('.catalog-content-main-item-top-fav').removeClass('active'); }else{ $('.catalog-content-main-item-top-fav').addClass("active"); } }); BX.addCustomEvent('onCatalogDeleteCompare', function(id) { $('.compare-control[value="'+id+'"]').prop('checked', false); }); Код html:
      <label class="catalog-content-main-item-top-fav <?= array_key_exists($arItem['ID'], $_SESSION["CATALOG_COMPARE_LIST"][5]['ITEMS'])?'active':''?>" > <input onclick="function f(e) { e.preventDefault();}" style="display: none" type="checkbox" value="<?=$arItem['ID'];?>" class="compare-control" <? if(isset($_SESSION['CATALOG_COMPARE_LIST']['5']['ITEMS'][$arItem['ID']])):?> checked="checked" <? endif;?>> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"> <path d="M12.2536 19.2043L12 19.055L11.7464 19.2043L5.28009 23.0103L6.73156 15.3278L6.78144 15.0638L6.58881 14.8765L1.09502 9.53481L8.50172 8.61114L8.7836 8.57598L8.89772 8.31586L12 1.24455L15.1023 8.31586L15.2164 8.57598L15.4983 8.61114L22.905 9.53481L17.4112 14.8765L17.2186 15.0638L17.2684 15.3278L18.7199 23.0103L12.2536 19.2043Z" fill="white" stroke="#E09B3D"/> </svg> </label> а этот код срабатывает только после перезагрузки страницы:  <?= array_key_exists($arItem['ID'], $_SESSION["CATALOG_COMPARE_LIST"][5]['ITEMS'])?'active':''?>
       
    • By Nathman999
      В #topmenu есть 4 прямоугольника-ссылки:"Основное","HTML","CSS","Сайт"
      Ссылки выглядят примерно так: http://htmlbook.ru/#main 
      Хотя если на них нажать никаких переходов не происходит(по крайней мере в адресной строке хрома ничего не меняется).
      Но панель под этими прямоугольниками меняется. А именно одна из 4-х панелей становится видимой(display: block;).
      Объясните пожалуйста как реализована такая технология.
    • By Marking
      проблема в том, что если я пишу путь так(через /) :
      <script src="/js/mainjs.js"></script> то гугл сообщает об ошибке, якобы файл не найден. Хотя файл html и папка js лежат в одном файле.
      как быть?
      PS если указать полный путь к js то все работает. 
  • Member Statistics

    46,609
    Total Members
    3,128
    Most Online
    Jasur
    Newest Member
    Jasur
    Joined
  • Recently Browsing   0 members

    No registered users viewing this page.