I need to create a script to scroll the ads on the website I am developing, with the pages. The want the ads to stay on screen when everything else scrolls, Anyone know where to find a good tutorial on this or have a good code to do this with that they are willing to share with me? Thanks in advance for any help.

Recommended Answers

There's lots of ways of doing it, the more sofisticated are with JavaScript, but it can be done easily done only with CSS, using position fixed.

See a example:

<!DOCTYPE html>
<html>

<body>
    <style type="text/css">

        #content {
            width: 500px;
            font-size: 30px;
        }

        #banner {
            position: fixed;
            top: 50px;
            right: …
Jump to Post

All 3 Replies

There's lots of ways of doing it, the more sofisticated are with JavaScript, but it can be done easily done only with CSS, using position fixed.

See a example:

<!DOCTYPE html>
<html>

<body>
    <style type="text/css">

        #content {
            width: 500px;
            font-size: 30px;
        }

        #banner {
            position: fixed;
            top: 50px;
            right: 50px;
            width: 100px;
            height: 100px;
            background: #0F0;
            color: #FFF;
            font-size: 30px;
        }

    </style>
    <div id="content">
        nonononononononononnoon<br/>
        nonononononononononnoon<br/>
        nonononononononononnoon<br/>
        nonononononononononnoon<br/>nonononononononononnoon<br/>
        nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>
        nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>
        nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>
        nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>
        nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>nonononononononononnoon<br/>
    </div>

    <div id="banner">
        Something
    </div>


</body>

So if the Ads are just pictures, and you want them to scroll on the display, sounds like you can use a simple slider.

Where do you want to fix the banner? Where on the page? Do you want it visible all the time or when the user scrolls down?

Thanks for the help guys I got it done and working.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of 1.20 million developers, IT pros, digital marketers, and technology enthusiasts learning and sharing knowledge.