Эффект при наведении курсора на картинку

Тема в разделе "Веб-дизайн", создана пользователем Artu, 18 окт 2009.

Статус темы:
Закрыта.
Модераторы: zek24
  1. Artu

    Artu Постоялец

    Регистр.:
    3 мар 2009
    Сообщения:
    75
    Симпатии:
    3
    Какой можно сделать эффект по теме.
    Картинки разные,выводятся динамически.
    Т.е. нужно интегрировать код вывода картинки с кодом эффекта.

    Рассматриваются любые варианты.
    Пример:переливание,волна,динамическое изменение цветов,эффект нажатия кнопки и др.Изменение размера (значителтьное) не рассматривается как эффект.
    По технологии: наверное лучше JS или библиотеки PHP.

    Не подскажите путь к руководству,подсказке и еще лучше к готовому примеру/примерам.
    Спасибо.:)
     
  2. Xata6

    Xata6 Постоялец

    Регистр.:
    20 мар 2007
    Сообщения:
    84
    Симпатии:
    5
    javascript эффекты можно взять за основу в jquery ui

    http://jqueryui.com/demos/effect/
     
  3. Artu

    Artu Постоялец

    Регистр.:
    3 мар 2009
    Сообщения:
    75
    Симпатии:
    3
    Спасибо Хатаб.

    А он и с картинками такое может?
     
  4. Elvan

    Elvan Писатель

    Регистр.:
    20 окт 2009
    Сообщения:
    8
    Симпатии:
    1
    Наподобе вопрос. Как сделать чтоб при наведение на картинку курсора она менялась на другую и работала как сылка?
     
  5. mdss

    mdss ♖♘♗♕♔♗♘♖

    Moderator
    Регистр.:
    20 фев 2007
    Сообщения:
    1.126
    Симпатии:
    668
    делаешь скрытый слой, в который ложишь фотку. При наведении на основной слой появляется скрытый и соответственно перекрывает этот самый основной слой
     
    Elvan нравится это.
  6. t3s

    t3s

    Регистр.:
    16 фев 2008
    Сообщения:
    719
    Симпатии:
    290
    стилями, примерно так:
    HTML:
    
    a {
    background: url('images/картинка') repeat-x;
    }
    
    a:hover {
    background: url('images/картинка_при_наведении_мЫша') repeat-x;
    }
    
     
  7. noxxxxx

    noxxxxx Постоялец

    Регистр.:
    19 апр 2007
    Сообщения:
    132
    Симпатии:
    32
    А я бы не заморачивался сильно по поводу эффектов. В крайнем случае затухание какое-нибудь плавное, не более того. Потому что лично меня, как человека занимающегося сайтостроительством не первый год, раздражают прилепленные "лишь бы прилепить" звёздочки, всполохи, волны и прочее... Сайт это в первую очередь информация и если она действительно хороша, то никаких эффектов не нужно... Любой эффект это лишне время загрузки и куски программного кода... Хотите эффектов - делайте флеш... А все эти пошленькие "примочки" не берите лучше... Не стоит оно того...
    ИМХО, впрочем, как всегда (с)
     
  8. rafic

    rafic

    Регистр.:
    14 май 2008
    Сообщения:
    477
    Симпатии:
    24
    На сайте должно быть все по минимуму и со вкусом. Чем больше примочек. Тем больше они отвлекают посетителя и раздражают его при чтении и восприятии информации.
     
  9. _axl

    _axl Постоялец

    Регистр.:
    24 сен 2008
    Сообщения:
    50
    Симпатии:
    8
    самое простое решение:
    #img:hover{
    cursor: pointer
    }

    для ie6 надо подцепить htchover
     
  10. askarbin

    askarbin

    Регистр.:
    31 мар 2009
    Сообщения:
    293
    Симпатии:
    36
    Я со встречным вопросом, у меня есть сайт, на котором реализовано примерно то, что хочет ТС, но вот мне как раз нужно избавиться от такого решения.

    Поясняю, верхнее горизонтальное меню состоит из картинок, которые меняются по наведении на них курсора на другие (JavaScript), вот мне нужно сделать так, чтобы вместо картинок был текст, а эффект был такой же. Т.е. Ссылка будет текстовой, а не картинкой, а при наведении фоновый цвет изменялся или же воном грузилась эта другая картинка.

    Задача связана с тем, что начальник решил, что нужно проиндексировать ссылку в этом меню.
    Мне пришла в голову идея, может быть оставить все как есть и добавить в <a>...</a> скрытый текст. Как в таком случае будет с индексацией??

    Вобщем рассмотрю все интересные варианты решений, спасибо всем откликнувшимся.

    Сайт тут http://www.kuban-kurort.com/
     
Статус темы:
Закрыта.