Grow your CSS skills. Land your dream job.

Center element in window issue…

  • # July 5, 2013 at 12:10 pm

    Hello,

    Below is a snippet of code I’m working on…essentially it animates an element to the browser top. I’m attempting to center the element in the browser window rather than offsetting 0px from the top. If anyone could please suggest a method for accomplishing this, I’d be ever so grateful. Thanks.

    Code:

    $(‘html,body’).clearQueue().animate({

    scrollTop: $(‘#element’).offset().top – 0

    }, 400);

    Edit:

    I’ve been attempting to work something like the following into function with out any luck…

    $(window).height() / 2) – $(‘#element’).height() / 2)

    # July 5, 2013 at 12:48 pm

    @paulie_d

    thanks for the resource…I actually read that this morning hoping it could solve the issue…unfortunately it wasn’t quite what I needed. Essentially…I have multiple stacked elements…overflowing outside the browser. Think of your standard JS carousel, but vertical. When the **active** element is clicked, it exits the browser top, and the next element slides up, offsetting the browser top by 0px. This works properly, but rather than offsetting the browser top by 0px, i’m trying to center the next element in the browser window.

    Here is a reference image…

    http://dl.dropboxusercontent.com/u/41773188/example.png

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".