+ Ответить в теме
Показано с 1 по 2 из 2

Тема: Проблема с hover

  1. #1
    Новичок Invert на пути к лучшему Аватар для Invert
    Регистрация
    23.12.2016
    Сообщений
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Проблема с hover

    Здравствуйте, я решил сделать сайт по шаблону от wix.com, я только учусь, вот не могу понять как сделать так что бы блок с картинкой заливался желтым с opacity 0.6 где-то и в то же время что бы эта картинка была ссылкой на саму себя но в окне галереи от fancybox.
    У меня заливка желтым уже стоит через hover, но картинка не работает как ссылка, если я убираю hover то ссылка становится активной и галлерея работает как задумано.
    Вот ссылка на шаблон сайта:
    http://ru.wix.com/website-template/v...7&category=all

    Вкладка "О нас", внизу есть фото команды, они при наведении на них мышкой заливаются желтым, а блок с текстом нет, у меня это работает, но не работает ссылка в картинке на галерею как в оригинальном шаблоне.

    Вот код HTML:

    <tr>
    <td id ="td1">
    <div id="line1block7">
    <div class="im"> <a class="gallery" rel="group" href="images/com_1big.jpg" width="240px" height="198px"> <img src="images/com_1.jpg" width="240px" height="198px"> </a></div>
    <span class="emp1">Юлия Соколова</span><span class="empinfo1"><p class="text1">Руководитель студии<br><br>Это текст. Кликните дважды, чтобы отредактировать его. Расскажите посетителям сайта о себе, своих услугах и преимуществах.</p></span>
    </td>
    </div>


    Вот код CSS:
    .im{
    width: 240px;
    height: 198px;
    margin-bottom: 5px;
    border: none;
    position: relative;
    }
    .im:hover{
    transition:all .5s;
    background: yellow;
    content: " ";
    opacity: 0;
    position: absolute;
    top:0; bottom: 0; left: 0; right: 0;
    }
    div:hover .im:after{
    opacity: .6;
    }
    .emp1, .empinfo1{
    padding-left: 10px;
    }
    .emp1{
    font-family: play, sans-serif;
    margin-top: 5px;
    padding-top: 15px;
    background-color: #CFCFCF;
    display: block;
    position: absolute;
    width: 230.2px;
    height: 29px;
    color: #FFFFFF;
    font-size: 19px;
    }

    Помогите пожалуйста решить проблему, а то я так ещё недели две или три буду сидеть над ней, я просто уже в тупике, или переписывать половину кода, или как-то исправлять этот...

  2. #2
    Местный vasian7474 на пути к лучшему Аватар для vasian7474
    Регистрация
    05.01.2017
    Сообщений
    277
    Thanks
    0
    Thanked 0 Times in 0 Posts
    _________________
    _________________
    Заработок на просмотре рекламы от 2000 рублей.
    Работаем с 2010 года.
    Ежедневные выплаты без задержек.

    Подробнее на сайте ....................


+ Ответить в теме

Похожие темы

  1. Ответов: 2
    Последнее сообщение: 07.09.2014, 13:21
  2. hover
    от alex4671 в разделе Jquery
    Ответов: 1
    Последнее сообщение: 06.11.2012, 03:35
  3. A:hover
    от people2010 в разделе CSS
    Ответов: 1
    Последнее сообщение: 03.04.2010, 12:16
  4. Ответов: 3
    Последнее сообщение: 16.03.2010, 12:33
  5. Проблема с hover
    от DasTPID в разделе CSS
    Ответов: 10
    Последнее сообщение: 13.09.2009, 09:35

Метки этой темы

Социальные закладки

Социальные закладки

Ваши права

  • Вы не можете создавать новые темы
  • Вы не можете отвечать в темах
  • Вы не можете прикреплять вложения
  • Вы не можете редактировать свои сообщения

 

Html-форум RATING ALL.BY Рейтинг@Mail.ru