наведите курсор мыши на всплывающее меню

Создание веб-сайта с использованием простого html (не html5) и css, но с эффектом наведения мыши. Нужно показать некоторый текст с фоновым изображением, когда пользователь наводит курсор на ссылку. Ниже приведен пример.

ОБЫЧНЫЙ: При выходе из мыши

НАД: alt text

Я не думаю, что можно создать эффект с помощью простого CSS. Мой вопрос в том, что является наиболее эффективным способом создания эффекта перегрузки и как? Javascript, DHTML или другой язык...

Заранее спасибо... Рекс...


person rex    schedule 12.09.2010    source источник


Ответы (2)


Рекс,

Я думаю, вы найдете jQuery очень полезным. jQuery — это фреймворк javascript, очень простой в использовании. www.jquery.com

Вы можете добиться своего эффекта с помощью чистого javascript, но, опять же, я думаю, вам будет намного проще использовать структуру javascript, поскольку вы исходите из actionscript.

Для вашего конкретного случая я бы сделал div абсолютно позиционированным. Чтобы показать div при наведении курсора, вы можете использовать jQuery $("#div_id").show(); а при отключении мыши используйте .hide();

Вот базовое руководство по использованию функции show hide для событий с помощью jQuery.

http://www.learningjquery.com/2006/09/slicker-show-and-hide

Удачи!

person jhanifen    schedule 13.09.2010
comment
Да, согласен с этим. JQuery Рокс - person Raymund; 13.09.2010
comment
Спасибо за ответ, я собирался спросить о javasciprt/jquery... на первый взгляд учебник выглядит так же, как я ищу... и немного больше... что здорово... Посмотрим, как пойдет... , Спасибо, Рекс - person rex; 13.09.2010

Вы можете использовать javascript, чтобы показать скрытый div, внутри которого написан текст.

для этого используйте события javascript onmouseover и onmouseout.

Однако пытались ли вы использовать свойство href:hover css для достижения этой цели?

person sushil bharwani    schedule 12.09.2010
comment
Привет, Сушил, спасибо за быстрый ответ... Я программист ActionScript, мало что знаю о Javascript и только изучаю CSS. Я знаю, что могу добавить изображение / изменить изображение bg, но не знаю о тексте .... Я склоняюсь к javascript, поскольку функции являются модульными ... поскольку я новичок в этом ... любые хорошие рекомендации по учебнику. .. Спасибо, Рекс - person rex; 12.09.2010
comment
посмотрите, поможет ли эта статья вам расширить свои знания alistapart.com/articles/hybrid - person sushil bharwani; 12.09.2010