Hi everyone, I will be glad to get some help with making an ad on my website sliding down the page. The 'position:fixed' is not good for me, because the ad is not fully shown "above the fold" I've seen the exact thing I'm looking for on some websites. Here is exactly what I need: sims.wikia.com/wiki/Forum:The_Sims_4_predictions When you scroll down the page, there is a square ad on the right, which will follow you down the page. Please help me find that code... Thank you very much, Major.
Here's the code for the ad: .wikia_anchor_ad .clickable { cursor: pointer; display: block; height: 126px; left: 0; position: absolute; top: 10px; width: 955px; }
I'm sorry, but that code you gave doesn't do that.. It's only set the initial position of the ad. the code actually should do something like that: make a static/absolute position into fixed and opposite. Someone???? Maybe the answer is not css, please help!
I just gave you the code for the ad that's on the page now. I'm not going to do your work for you. You need to take the code and figure it out.
If you have a DOM inspector (all modern browsers have it I believe), you could see that the right AD box (on that http://sims.wikia.com/wiki/Forum:The_Sims_4_predictions page) changes its CSS position from relative to fixed, whenever page has been scrolled down below AD's offsetTop? So I think there has to be some JS hooked to body element which listens to page scrolling event.
I finally figure it out.. Just like I though, the idea is to make the container <div> of the ad position:fixed and cancel on scrolling. Those can be achieved by Jquery and not CSS alone.