[Помогите] Как реализовать?

Тема в разделе "OpenCart", создана пользователем syrax, 28 окт 2015.

  1. syrax

    syrax

    Регистрация:
    28 окт 2015
    Сообщения:
    1
    Симпатии:
    0
    Как реализовать следующее:
    В списке товаров категории, при наведении на изображение товара, отображается пользовательский текст (по типу overlay эффект)
     
  2. Baco

    Baco Антихронофаг Команда форума

    Регистрация:
    9 окт 2012
    Сообщения:
    803
    Симпатии:
    399
    Код:
    <div id='container'>
      <div style="visibility: hidden">
         My hidden text
      </div>
    </div>
    
    ну и сам скрипт обработки:
    Код:
    <script type="text/javascript">
    $("#container").hover(function () {
        $("#container div").css("visibility","visible");
    },
    function () {
        $("#container div").css("visibility","hidden");
    });
    </script>
     
    syrax нравится это.
  3. Marrie

    Marrie

    Регистрация:
    7 сен 2015
    Сообщения:
    51
    Симпатии:
    10
    зачем сразу скриптами?? да и style="visibility: hidden" не стоит использовать. ВСЕ СТИЛИ всегда записывать только!!! в таблицу каскадных стилей

    <div id='container'>
    <h1 class="title">TITLE</h1>
    <div class="hidden">
    My hidden text
    </div>
    </div>


    #container .hidden{
    visibility: hidden;
    opacity:0;
    transition:0.3s;
    }
    #container:hover .hidden{
    visibility: visible;
    opacity:1;
    }