Scrolling ads at the bottom while scrolling in a website [Example]

Discussion in 'JavaScript' started by search engine, Oct 9, 2011.

  1. #1
    Hello guys,

    I would like to know how can we insert ads or anything in the bottom of the browser so whenever the user scroll it will simply scroll too.

    check the website please:

    http://www.jeddahbikers.com/

    I would love to insert this in my wordpress blog.
     
    search engine, Oct 9, 2011 IP
  2. yho_o

    yho_o Well-Known Member

    Messages:
    354
    Likes Received:
    6
    Best Answers:
    1
    Trophy Points:
    140
    #2
    html code:

    css:

    #myAds { position:fixed; bottom:0; left:0; width:100%; height:auto; z-index:99;}
    Code (markup):
     
    Last edited: Oct 10, 2011
    yho_o, Oct 10, 2011 IP
  3. olando

    olando Active Member

    Messages:
    71
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    91
    #3
    with close button:
    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'>
    </script><br >
    <script type='text/javascript'>
    $(document).ready(function() {
    $('img#closed').click(function(){
    $('#btm_banner').hide(90);
    });
    });
    </script>
    <style type='text/css'>
    div#btm_banner {
    bottom: 0;
    position: fixed;
    width: 100%;
    opacity: 0.9;
    left: 0;
    }
    div#btm_banner img{
    border:0;
    cursor:pointer;
    }
    </style>
    <div style='height: 0px;'></div>
    <div align='center' id='btm_banner' style='height: 110px; z-index: 9999;'>
    <div style='text-align: right; width: 735px; height: 3px;'>
    <img id='closed' src='http://tunden.com/close-icon.png'/></div>
    <div style='clear: both;'></div>
    <p>
    <p><center>
    your ads code
    </center></p>
    </p>
    </div>
    Code (markup):
     
    olando, Dec 12, 2011 IP