Log in

View Full Version : How to make footer float on the screen?



ratih
12-04-2008, 03:22 AM
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

bluewalrus
12-04-2008, 04:11 AM
#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.

xahx
12-05-2008, 04:21 AM
dynamicdrive.com has a Css code for it i think i saw it a while back

ratih
12-05-2008, 05:26 AM
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

xahx
12-05-2008, 09:01 PM
http://www.dynamicdrive.com/dynamicindex1/staticmenu.htm << right here buddy!

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

ratih
12-06-2008, 03:33 AM
thanks! xahn..

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

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

xahx
12-06-2008, 05:03 AM
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="cursor:pointer" 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.

bluewalrus
12-06-2008, 06:41 AM
I don't think that's what he's looking for. I gave that basic solution earlier up.

xahx
12-06-2008, 09:13 AM
its just a more detailed explanation but you are right, it is the same idea. i guess you're smarter, and wiser.. :'(