Results 1 to 9 of 9

Thread: How to make footer float on the screen?

  1. #1
    Join Date
    Jun 2008
    Posts
    15
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Question How to make footer float on the screen?

    hi do u know where can find the script footer that stays on the screen eventhough you scrool the page down? or if you personally have do u mind posting it here?

    thanks in advance

    ratih

  2. #2
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    #nameofdividhere{position:fixed;bottom:0;left:0;width:100%;height:30px;z-index:20;}

    Should do it. Found this somewhere a while ago but i can't cite it now.

  3. #3
    Join Date
    Dec 2008
    Location
    Torrance CA
    Posts
    18
    Thanks
    3
    Thanked 2 Times in 2 Posts

    Default

    dynamicdrive.com has a Css code for it i think i saw it a while back

  4. #4
    Join Date
    Jun 2008
    Posts
    15
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    bluewalrus: thanks i will try it...and let u know what happen...

    xahx : icant find it on dynamic drive..maybe im using wrong keywords..i looked for footer...cant find any

  5. #5
    Join Date
    Dec 2008
    Location
    Torrance CA
    Posts
    18
    Thanks
    3
    Thanked 2 Times in 2 Posts

    Default

    http://www.dynamicdrive.com/dynamici...staticmenu.htm << right here buddy!

    let me know if this is what your seeking, you can customize the floating menu im sure!

  6. #6
    Join Date
    Jun 2008
    Posts
    15
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    thanks! xahn..

    this is a bit different from what im looking for, but i would surely use it..!

    is it totally different script if i want to make it like this?
    http://www.bhinneka.com/aspx/bhindexpc.aspx

  7. #7
    Join Date
    Dec 2008
    Location
    Torrance CA
    Posts
    18
    Thanks
    3
    Thanked 2 Times in 2 Posts

    Default

    oh!


    thats easy too... check it out...

    this is his code for that bar:

    <div id="divCalculator">
    <div style="position:relative;left:-2px">
    <table border="0" width="100%" id="table1" cellspacing="0" cellpadding="0">
    <tr>
    <td style="width: 100px" valign="top"><a href="#" style="cursorointer" onclick="javascript:newWin=window.open('/aspx/others/oth_bangkredit_simulasi.aspx?harga=0','pwin','toolbar=no,height=600,width=600,location=no,status=no,scrollbars=no,resize=no,menubar=no');" ><img id="ctl00_imgCalcKiri" src="../App_Themes/Hijau/images/calc_kiri.gif" style="height:50px;width:100px;border-width:0px;" /></a></td>
    <td valign="top" id="calcBackground">
    <div style="margin:0px;padding-top:4px;text-align:center;height:18px;color:White;font-size:10pt;letter-spacing: 2px;">
    <img alt="" src='/images/cbn.gif' width="450" height="15" />

    </div>
    <div style="margin: 0px; padding: 0px;">
    <span style="font-family: Verdana; font-size: x-small;"><strong>Kurs </strong></span>
    <span id="ctl00_lblDate" style="color:White;font-family:Verdana;font-size:X-Small;font-weight:bold;">5 Dec 2008</span>
    <select name="ctl00$ddlCurrency" id="ctl00_ddlCurrency" class="std" onchange="changerate(this)" style="font-family:Verdana;font-size:X-Small;">
    <option value="US$">US$</option>
    <option value="YEN">YEN</option>

    </select>
    &nbsp;
    <span id="ctl00_lblIDR" style="font-family:Verdana;font-size:X-Small;font-weight:bold;">Rp</span>
    <input onchange="calculateCurrency()" id="txtRate" type="text" value="12300" class="std" style="text-align: right; width: 100px;" onfocus="this.select()" />
    <input type="button" value=" + " onclick="setOperator('+')" class="std" />
    <input type="button" value=" - " onclick="setOperator('-')" class="std" />
    <input type="button" value=" x " onclick="setOperator('*')" class="std" />
    <input type="button" value=" / " onclick="setOperator('/')" class="std" />

    <input onchange="calculateCurrency()" type="text" value="0" id="b" class="std" style="text-align: right; width: 100px;" onfocus="this.select()" />
    =
    <input type="text" value="0" id="ans" class="std" style="text-align: right; width: 100px;" onfocus="this.select()" />
    <input type="reset" value=" Reset " onclick="setOperator('/')" class="std" />
    </div>
    </td>
    <td style="width: 80px" valign="top"><img id="ctl00_imgCalcKanan" src="../App_Themes/Hijau/images/calc_kanan.gif" style="height:50px;width:80px;border-width:0px;" /></td>
    <td style="width: 15px">&nbsp;</td>
    </tr>

    </table>
    </div>

    this <div> name is called "divCalculator"

    Just make sure in ur CSS you have a line that specifies:
    #divCalculator {position: fixed; bottom: 0px; text-align: center; width: 1014px; z-index: 1;}
    customized to your own specs of course they items in red are key elements

    good luck.

  8. #8
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    I don't think that's what he's looking for. I gave that basic solution earlier up.

  9. #9
    Join Date
    Dec 2008
    Location
    Torrance CA
    Posts
    18
    Thanks
    3
    Thanked 2 Times in 2 Posts

    Default

    its just a more detailed explanation but you are right, it is the same idea. i guess you're smarter, and wiser.. :'(

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •