The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript How to properly hide a div on page load?

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #33519

    I’m working on a small project where I am moving the wp_admin_bar inside a div that is actually collapsed on page load with the following function. I have to place this function in the bottom of the footer.php file so that it loads after the wpadminbar built in js loads.

    The problem I am having is that when the page first loads you are able to see the wpadminbar flash on the top of the screen prior to it being moved into the #sites div.

    How do I change the following code so that the user cannot see the wpadminbar div loading into the sites div on page load?

    I use the following code actually hide the #sites div itself:

    function sitesDrawer() {

    var closeWidget = jQuery("Close");
    jQuery('#sites .wrap').append(closeWidget);

    jQuery("#sites .close, .switch a").click(function(){

    if (jQuery('.switch a').hasClass("open")) {
    jQuery("#sites ").slideToggle("fast","swing");
    jQuery('.switch a').removeClass('open');
    } else {
    jQuery("#sites ").slideDown("fast","swing");
    jQuery('.switch a').addClass('open');
    return false;

    I trigger the div dropdown with the following link:

    The html is simple enough. This is at the top of my page

    thanks for any help


    I have this in the header of my theme #wpadminbar { display:none; }

    That should be loading before anything else. I think the problem is that wp is inserting the wpadminbar so timing the firing of display:none and holding that during the wpadminbar js load is where I think it is getting stuck


    got it solved, by forcing it hidden then adding js to display block


    No idea how to mark this as resolved…

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.