StickyFooter -- Verticale scrollbar bij Chrome, Opera & Safari
Ik ben een bezig met een stabiele basis te maken voor toekomstige websites. Waar o.a. een StickyFooter in verwerkt zit.
Helaas krijg ik bij Chrome, Opera & Safari een scrollbalk voor ±15 pixels.
Aangezien ik redelijk perfectionistisch ingesteld ben wil ik deze kreukel er even uitstrijken.. Maar helaas zie ik de oorzaak van deze scrollbalk over het hoofd.
De desbetreffende pagina is te vinden op http://www.exonero.nl
Ik hoop dat jullie er even willen naar kijken en misschien de oorzaak van m'n probleem terug vinden.
Thanks in advance!
Gewijzigd op 16/07/2011 19:15:56 door Tele text
Nee, Firefox staat ook niet in de lijst :P IE & Firefox werken prima idd..
gewoon min-height op 99% doen, of met javascript, zo heb ik het opgelost.
Ooit gevonden op het internet :D
Zover ik weet werkt het bijna op alle browsers
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<script language="javascript" type="text/javascript">
$(document).ready(function() {
positionFooter();
$(window).scroll(positionFooter).resize(positionFooter);
function positionFooter() {
var docHeight = $(document.body).height() - $("#sticky-footer-push").height();
if(docHeight < $(window).height()){
var diff = $(window).height() - docHeight;
if (!$("#sticky-footer-push").length > 0) {
$("#footer").before("<div id='sticky-footer-push'></div>");
}
$("#sticky-footer-push").height(diff);
}
}
});
</script>
$(document).ready(function() {
positionFooter();
$(window).scroll(positionFooter).resize(positionFooter);
function positionFooter() {
var docHeight = $(document.body).height() - $("#sticky-footer-push").height();
if(docHeight < $(window).height()){
var diff = $(window).height() - docHeight;
if (!$("#sticky-footer-push").length > 0) {
$("#footer").before("<div id='sticky-footer-push'></div>");
}
$("#sticky-footer-push").height(diff);
}
}
});
</script>
Gewijzigd op 16/07/2011 21:51:30 door Marc Hagen
Zoals ik al zei ben ik nog al een perfectionist en wil alles 100% valid en ik vind min-height: 99%; toch een beetje messy/dirty.
Gelukkig ben ik er wel achter wat het probleem was. Namelijk de UL in m'n navigatie. Was simpel weg te verhelpen door midden van een float: left; en/of fixed width en height op m'n sidebar div.
Overigens is de site nu (voor de geïnteresseerden) te vinden op http://test.exonero.nl
thanx anyway!
Gewijzigd op 19/07/2011 11:16:54 door Jur Joosten
ik heb nog steeds een scrollbar hoor
Klopt, heb hem nu in m'n localhost bewerkt. nog niet geupload ;) Speel zelf maar eens met de CSS. (>firebug 4chrome?<)