CODEWITHSUNDEEP
javascriptjqueryhtml
havingagoatit
havingagoatit

Reputation: 583

removing a div using jquery but keeping divs inside it

I am trying to remove a div after a timed event using jquery.. currently the initial timer is as follows.....

$(document).ready(function () {
    setTimeout(function () {
        $("#loader-wrapper .loader-section, #textbit").hide("slow");
        $("#logo").animate({ left: '-115px', top: '-60%' });
        $("#logo-side").animate({ opacity: 9 }, 2000);
        $("#loader-wrapper").remove();
    }, 2000);
});

I am doing a few things here with divs outside the loader-wrapper but the div logo needs to remain on the page while the loader-wrapper needs to go after the timed event has performed all functions...

in its current form the loader-wrapper is removed (without the .hide transition happening) and also the logo div which is nested inside it... can somebody suggest/provide a workaround ?

the html looks like this ....

<div id="loader-wrapper">
    <div id ="wrapper">
       <div id="logo"><a href="index.html"><img src="images/mthc/logo-main.png" height="130px" width="420px"></a>
       </div>
    </div>
 </div>

Upvotes: 1

Views: 679

Answers (6)

Dusty
Dusty

Reputation: 364

try

$(document).ready(function() {  
setTimeout( function () {
$("#loader-wrapper .loader-section, #textbit").hide("slow");
$("#logo").animate({left: '-115px', top:'-60%'}); 
$( "#logo-side" ).animate({ opacity: 9 }, 2000);
setTimeout(function(){
$("#loader-wrapper").remove(); 
},4000);
}, 2000 );

This will remove the #loader-wrapper after the animation is running });

Upvotes: 1

Shaunak D
Shaunak D

Reputation: 20626

If you are not sure about the child elements,

Use,

$("#loader-wrapper > *").unwrap();

Also, use animate() callbacks to have the elements removed after the animation occurs.

$("#logo-side").animate({
    opacity: 9
}, 2000, function () {
    $("#loader-wrapper > *").unwrap();
});

Upvotes: 1

Vic
Vic

Reputation: 8961

It sounds like you just want to remove the #loader-wrapper div?

In that case, you can use jquery's unwrap

$('#wrapper').unwrap();

Upvotes: 2

Anoop Joshi P
Anoop Joshi P

Reputation: 25527

You can use .unwrap();

$("#wrapper").unwrap();

Upvotes: 1

Jamie Dixon
Jamie Dixon

Reputation: 53991

jQuery has an unwrap method that you can use to remove the loader-wrapper.

$('#wrapper').unwrap();

https://api.jquery.com/unwrap/

Upvotes: 5

Radonirina Maminiaina
Radonirina Maminiaina

Reputation: 7004

You can use unwrap to remove the wrapper.

$("#wrapper").unwrap();

Upvotes: 0

Related Questions