If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 1 of 1
  1. #1
    Join Date
    Nov 2012
    Huddersfield, West Yorkshire
    Member #
    5 times

    Animate Fixed Header

    Okay so I have a header on a new site I am working on.

    /* CSS */

    header {display: none;}

    Now I have a Scroll Point Jquery script, so when the page scrolls to a certain point, the header changes to:

    /* CSS */

    header {display:block; position: fixed;}

    This works fine, but I want to know how to animate this in the jQuery.

    // JS //


    var stickyHeaderTop = $('#wrapper').offset().top;

    if( $(window).scrollTop() > stickyHeaderTop ) {
    position: "fixed",
    display: "block"
    else {
    position: 'relative',
    top: '0px',
    display: "none"

    I have tried replacing .css with .animate, but still no luck.

    Any help would be greatly appreciated


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
All times are GMT -6. The time now is 12:58 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2021 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: