animate, всплывающий div box сделать по центру
Есть 2 div box'a (photo_box и property_box). Вроде как один box (photo_box) это div с уменьшенной картинкой, а второй box (property_box) это div, куда входит увеличенная картинка с детальным описанием этой картинки. Второй box всплывает при наведении на первый (меньший) box. Когда указатель мыши вне области второго div box, тот скрывается.
Написал так: $(".photo_box").mouseenter(function(){ $(".property_box").stop().animate({opacity: "1.0", width: "241", height: "303"}, "slow"); }); $(".property_box").mouseleave(function(){ $(".property_box").stop().animate({opacity: "0.0", width: "0", height: "0"}, "slow"); }); Всё работает. Да вот только всплывание property_box происходит начиная сверху слева и заканчивая снизу справа. Тоже самое с скрытием, только наоборот. Так вот нужно чтобы это было всё по центру. Вобщем чтоб всплывало начиная от самого центра photo_box. Спасибо за помощь. |
устанавливаем для начала position: absolute для property_box .Затем в момент его появления находим положение photo_box через .offset(), он вернет left и top относительно документа. Находим координаты центра дива. Присваиваем их соответсвенно свойствам left и top property_box'а. И в добавок анимируем отрицательный марджин, равный половине ширины и высоты соответственно: marginLeft: -120, marginTop: -151.
|
Часовой пояс GMT +3, время: 16:21. |