активация спрайта при наведение на ссылку

Тема в разделе "Верстка", создана пользователем artefakt777, 8 авг 2014.

Информация :
Уважаемые пользователи, прежде чем ответить в теме или создать новую, внимательно ознакомьтесь с Правилами раздела и Правилами форума
Для быстрого поиска ответов на ваши вопросы воспользуйтесь Картой раздела и/или Поиском по разделу
Модераторы: ultra
  1. artefakt777

    artefakt777

    Регистр.:
    15 июл 2012
    Сообщения:
    487
    Симпатии:
    125
    Собственно есть спрайт в связке с ссылкой. При наведение на картинку (спрайт) выделяется и ссылка, а вот при наведение на ссылку спрайт остается неизменным.

    Код:
    <a href="/katalog/sarafani">
     <div class="icons">          
    <div class="ico1"> </div>
    Сарафаны
     </div></a>
    
    css:
    Код:
    .ico1 {
    background: url(/images/ico1.png);
    background-repeat: no-repeat;
    display: block;
    width: 45px;
    height: 52px;
    margin: 0 auto;
    margin-bottom: 5px;
    }
    
    .ico1:hover {
        background: url(/images/ico1.png) 0 -52px;
        background-repeat: no-repeat;
        display: block; 
        width: 45px; 
        height: 52px;
        margin:0 auto;
        margin-bottom: 5px;
       }
    
     
    avtorit1949 нравится это.
  2. Sunday

    Sunday

    Регистр.:
    13 дек 2009
    Сообщения:
    758
    Симпатии:
    326
    Картинку свою покажите и скажите более внятно, какого результата хотите достичь.
     
  3. artefakt777

    artefakt777

    Регистр.:
    15 июл 2012
    Сообщения:
    487
    Симпатии:
    125

    Куда яснее то. Нужно, чтобы при наведение на текст ссылки менялось изображение
     
    Последнее редактирование: 8 авг 2014
  4. Sunday

    Sunday

    Регистр.:
    13 дек 2009
    Сообщения:
    758
    Симпатии:
    326
    В таком случае не понятно, в чем вопрос? Куча инфы, как делать спрайты.
    http://jsfiddle.net/ut2rynoo/
     
    Последнее редактирование: 8 авг 2014
  5. artefakt777

    artefakt777

    Регистр.:
    15 июл 2012
    Сообщения:
    487
    Симпатии:
    125
    Вопрос в том, как реализовать, чтобы при наведение курсором мыши на текст ссылки, который находится под картинкой - срабатывал спрайт, а именно менялась картинка.

    В данный момент при наведение курсором на картинку - срабатывает спрайт, картинка меняется, а также выделяется и текст под картинкой.
    НО при наведение курсором на текст ссылки, спрайт не срабатывает! и картинка НЕ меняется!
     
  6. Sunday

    Sunday

    Регистр.:
    13 дек 2009
    Сообщения:
    758
    Симпатии:
    326
    Добавил там и текст ссылки и картинку.
    http://jsfiddle.net/ppm2xq9p/
    Если и это не то, тогда мне не понятно, что требуется.
     
    artefakt777 нравится это.
  7. artefakt777

    artefakt777

    Регистр.:
    15 июл 2012
    Сообщения:
    487
    Симпатии:
    125
    При таком способе тексту ссылки задаются параметры картинки и не представляется возможным его выровнить http://jsfiddle.net/ppm2xq9p/5/
    А вот как должен быть расположен текст ссылки, но здесь при наведение на ссылку - картинка не меняется http://jsfiddle.net/ppm2xq9p/6/
     
  8. krasnblj

    krasnblj Создатель

    Регистр.:
    10 апр 2013
    Сообщения:
    12
    Симпатии:
    3
    Посмотри http://jsfiddle.net/ecyzyydr/
     
    artefakt777 нравится это.