содержимое div не анимируется

Question

содержимое div не анимируется

0

Привет, я использую jquery для анимации окна слева для слайда справа, чтобы показать ссылку на facebook, окно слайдов прекрасно, но текст внутри не влияет на функцию jquery, мой код:

Jquery

$(document).ready(function () {

    $("#social").mouseenter(function () {

        $("#social").animate({
            width: 50
        });

    });

    $("#social").mouseleave(function () {

        $("#social").animate({
            width: 20
        });

    });

});

HTML

<div id="social"><a href="xxxx.com">test</a></div>

Проблема в том, что href, он не анимируется с div, я пытался дать href id, но не работал

Katyoshah 18 фев. 2014, в 10:59

Источник

1

Как вы имеете в виду "не оживляет с div "? Можете ли вы опубликовать JSFiddle, показывая проблему?
CompuChip 18 фев. 2014, в 09:34
0

вам нужно, чтобы ваш <a href> также расширялся вместе с div?
yashhy 18 фев. 2014, в 09:41

Теги:

javascript

jquery

html

jquery-animate

4 ответа

Ещё вопросы

Как вы имеете в виду "не оживляет с div "? Можете ли вы опубликовать JSFiddle, показывая проблему?
вам нужно, чтобы ваш <a href> также расширялся вместе с div?

evuez · Answer 1 · 2014-02-18T07-24-00.000Z

Не уверен, что это то, что вы хотите, но если вы хотите, чтобы <a> расширялось вместе с <div>, просто добавьте display: inline-block; и width: 100%; в вашем css:

#social a {
    display: inline-block;
    width: 100%;
}

Демо-версия скрипта

Katyoshah · Answer 2 · 2014-02-18T07-19-00.000Z

Спасибо, ребята, я нашел решение, мне нужно изменить marginLeft так, чтобы он выглядел так, как будто вся коробка с ссылкой была немного спрятана, а затем показывает

   $(document).ready(function(){

    $("#social").mouseenter(function(){


$("#social").animate({width:80});
$("#social").animate({marginLeft:'0px'});



     });

      $("#social").mouseleave(function(){


$("#social").animate({width:40});
$("#social").animate({marginLeft:'-10px'});



      });

       });

Felix · Answer 3 · 2014-02-18T07-12-00.000Z

Вы должны убедиться, что ваш div имеет указанную ширину для анимации, например:

#social {
    width: 20px;
}

Демо-версия скрипта

Prashobh · Answer 4 · 2014-02-18T06-53-00.000Z

Попробуйте с e.preventdefault()

$("#social").mouseenter(function () {
       e.preventdefault();
        $("#social").animate({
            width: 50
        });

    });