Using .fadeOut (), but I want STAY to disappear?

I use this code to make some div (#extras) disappear.

$(document).ready(function() {

            for(var i = 1; i <= pageLimit; i++) {
                $('body').append('<div id="page' + i + '" name="page' + i + '" class="touch"></ div>' ); 
            }

            $('body').append('<div id="extras" class="showUp">..all content needed goes in heree...</div>');
            $(window).load(function() {
                $('div#extras').delay(100).fadeOut(4000); 
            });
});

CSS

div#extras {
    height:100%;
}

&

body > div.showUp {
    display: block !important;
    height:100%;
}

It fades away fine, but then rolls back again when it makes a fading animation. How can I make him stay pale? In another function, I fade out again.

This is the default css that I have from the JQtouch sample I was working on.

body > * {
background: transparent;
-webkit-backface-visibility: hidden;
display: none;
position: absolute;
left: 0;
text-align:center;
width: 100%;
-webkit-transform: translate3d(0,0,0) rotate(0) scale(1);
height: 100% !important;
}

Thank!

Was the fact that the extras div was inserted into the page by the .append () function has anything to do with getting it to go back?

+3
source share
2 answers

I have had success using:

$ ("# element"). fadeTo ("fast", 0.33);

"", , .

+2

.fadeTo(0) ( - , , "opaquely", .fadeTo(250) .....

:

$("#extras").fadeTo(500, 0);

, .

[edit] - . http://api.jquery.com/fadeTo/

0

Source: https://habr.com/ru/post/1755812/


All Articles