Problem with delay in jquery

The simplest thing seems to be to use the setTimout and .hide () ( .hide() does the same as .css('display', 'none') ) :

setTimeout(function () {
    $("header").hide();
}, 1000);
setTimeout(function () {
    $(".logo_1").hide();
}, 2000);

Example

jQuery has a "queue" .queue () to be able to chain functions . In this case the look and feel would look like this:

$("header")
    .delay(1000)
    .queue(function (next) {
    $(this).css('display', 'none');
});
$(".logo_1")
    .delay(2000)
    .queue(function (next) {
    $(this).css('display', 'none');
});

Example

The reason your code did not work is to read on the jQuery documentation page:

  

The .delay () method allows you to delay the execution of functions that are in queue . It can be used with a queue of effects or a custom queue.

The delay method only applies to animations, and hiding an element without fade, only by manipulating the display property, does not involve animation.

A brief fadeOut should resolve:

$("header").fadeOut(100);
$(".logo_1").delay(2000).fadeOut(100);

Or (same effect):

$("header").hide(100);
$(".logo_1").delay(2000).hide(100);

You will see the delay between the two fades. If you want a delay at the beginning and there is no pending animation before then, use a setTimeout :

setTimeout(function(){
    $("header").hide(100);
    $(".logo_1").delay(2000).hide(100);
}, 1000);