Skip navigation
Currently Being Moderated

Javascript Stop Scrolling

Oct 23, 2013 5:04 PM

So I need my adboxes to not scroll above a certain height, and to not scroll below a certain height.

 

It seems to work perfectly in the jsfiddle

 

http://jsfiddle.net/FDv2J/4/

 

but then when I apply it to the site....it fails me

 

http://testing123.crimsonlakemc.com/

 
Replies
  • Currently Being Moderated
    Oct 25, 2013 5:29 AM   in reply to Gabriel McKenna

    Ideally I would also like the ads to float at

     

    top: 50%;

    margin-top: -300;

    This doesn't make sense because unless the window height is more than 1000px your banner goes behind the header area.

     

    The main reason why your script is not working is this:

    var top = $el.parent().position().top;

    Your banner's parent is <body> so the value of top is 0. Try setting it to 200 because that is the height of your header.

     

    --

    Kenneth Kawamoto

    http://www.materiaprima.co.uk/

     
    |
    Mark as:
  • Currently Being Moderated
    Oct 25, 2013 7:16 AM   in reply to Gabriel McKenna

    The goal I am trying to achieve is so that the adbox cannot go behind the header, or the footer. And if the user is scrolling and the page is long enough then the ad position will be positioned to the center of the screen which would be top: 50%; and margin-top:-300px; in my case.

    If that's your goal then why are you using a script that scrolls the banner ad? You want it to be stationery.

     

    --

    Kenneth Kawamoto

    http://www.materiaprima.co.uk/

     
    |
    Mark as:
  • Currently Being Moderated
    Oct 25, 2013 7:26 AM   in reply to Gabriel McKenna

    That's what I had it set to, but because my header is so large on same screens it will still slide under the header just a little bit.

    Logically, if you have a window taller than (200 + 300)*2 = 1000px (you said you and your audience all have that) your banner will never go under the header. (By "window" I mean the viewable area, not the monitor size.)

     

    --

    Kenneth Kawamoto

    http://www.materiaprima.co.uk/

     
    |
    Mark as:
  • Currently Being Moderated
    Oct 28, 2013 5:29 AM   in reply to Gabriel McKenna

    My entire audience isn't guaranteed to use that large of monitors

    That's my point. You don't know the user environment so that you'll need to prepare for all possible situations.

     

    • Your banner is to be placed in the middle of the window.
    • If your content area is less than 600px tall there's no space for your banner.
    • If the window is less than 1000px tall you cannot place the banner in the middle of the window.
    • If the window is shorter than 800px the banner will not be fully visible.
    • If your body is shorter than the window you cannot place the banner in the middle of the window.
    • The banner cannot touch the footer.

     

    Not sure how far you want to go but I'd probably start with the CSS media query to set the initial positioning.

     

    --

    Kenneth Kawamoto

    http://www.materiaprima.co.uk/

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points