JQuery анимировать один элемент при наведении на другой - PullRequest
Новая
       21

JQuery анимировать один элемент при наведении на другой

0 голосов
/ 18 сентября 2011

У меня есть успешная (почти) анимация в jquery, но теперь мне нужен текст с надписью "клик". появляться всякий раз, когда я наводю курсор на элемент div, который становится более широким за счет события over. Событие делает div шире при входе и уже при выходе, и это работает.

Итак, я хочу что-то вроде этого: 

if($( this).width() >= "25") //  if the width is greater than 25
    $("#clickme").css('opacity', 0) // - effect a DIFFERENT id which is my "click.."

и, конечно, после ухода мыши сделайте обратное. Я не могу заставить это работать до сих пор

У меня есть часть jquery в корзине для пасты http://pastebin.com/AQwLeBbc

Есть какие-нибудь подсказки?

Ответы [ 2 ]

0 голосов
/ 18 сентября 2011

Это выполняет то, что вы хотите.Он использует функцию .hover (), чтобы назначить объекту два обработчика: один при наведении мыши, другой при наведении мыши. 

$('.selector').each(function() {
        var clicktext = null;
        $(this).hover(function() {
                var pos = $(this).offset();
                // add the click text and assign it to the proper variable
                // this code can be changed to what ever it takes for your code
                // just make sure to leave the zIndex at a greater than 0 value
                // and the position values as they are. Padding, etc. are optional.
                clicktext = $('<div>').css({
                        zIndex: 1000,
                        padding: "2px",
                        position: "absolute",
                        left: pos.left,
                        top: pos.top
                }).text("click").appendTo('body');
        }, function() {
            clicktext.remove();
        });
});

-Sunjay03

0 голосов
/ 18 сентября 2011

Если вы хотите расположить div над другими элементами, вы можете использовать фиксированное или абсолютное позиционирование с css. Вы можете получить позицию текущего элемента, на который наведен курсор, с помощью: 

.offset()

http://api.jquery.com/offset/

Затем используйте offset (), чтобы установить позицию вашего зависания div. Если вы хотите, чтобы div завис над всем, лучше всего указать его в качестве первого элемента тела.

...