jQuery - Анимационный элемент, которому расположили детей абсолютно снаружи - мигание

Строка в Java это просто объект вокруг массива символов. Следовательно, a

char[]

идентична распакованной строке с теми же символами. Создавая новую строку из вашего массива символов

new String(char[])

, вы, по сути, говорите компилятору автоматически помещать объект String вокруг массива символов.

12
задан 6 July 2009 в 02:49
поделиться

2 ответа

Когда jquery анимирует высоту или ширину элемента, он автоматически установит overflow: hidden для элемента во время анимации. Поскольку ваш дочерний элемент расположен снаружи, технически он является частью переполнения. Комментарий в исходном коде jquery рядом с кодом, который это делает, говорит: «// Убедитесь, что ничего не просачивается». Если вы включите несжатый источник jquery и закомментируете строку 4032 jquery-1.3.2. js (внутри функции animate ):

//this.style.overflow = "hidden";

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

12
ответ дан 2 December 2019 в 18:20
поделиться

Ну, похоже, что это функция браузера или jQuery, не обязательно того способа, которым вы создали свой HTML или Javascript. Я говорю это, потому что кажется, что визуализируется только область пикселей внутри ограничивающей рамки элемента DOM (попробуйте переместить текст так, чтобы половина текста была снаружи, а половина внутри ... вы видите "отрезанный" кусок текста во время его анимации.)

Вот как можно обойтись: он использует DIV-оболочку вокруг "#box" и "#outside", так что оба они находятся внутри ограничивающей рамки оболочки.

CSS:

    #boxWrapper {
        position: fixed;
        top: 50%;
        left:  50%;
        width: 200px;
        height: 200px;
        margin-left: -100px;
        margin-top: -120px; /* extra 20px for the #outside */
        background:#ccc;
    }

    #box {
        background: #000;
        height:100%;
        width:100%;
        margin-top:20px; /* give 20px for the #outside */
    }

    #outside {
        background:darkblue;
        position: absolute;
        top: 0px;
        right: 0; }

И HTML:

<div id="boxWrapper">
    <div id="box">
        <a href="#">CLICK ME</a>
        <div id="outside">
            I'm positioned OUTSIDE the box
        </div>
    </div>
</div>

И Javascript:

<script type="text/javascript">
    $(document).ready(function() {

            $("#box a").click(function(){
                $("#boxWrapper").animate({ 
                        height: "410px",
                        opacity: 0.9,
                        top: "25%"
                      }, 1000 );
                return false;
            });
        }); 

</script>   
1
ответ дан 2 December 2019 в 18:20
поделиться
Другие вопросы по тегам:

Похожие вопросы: