scroll() / .scrollTop() nicht mit absoluten Angaben?
Hey,
ich habe einen flexiblen Container (mit keinen festen height angaben (nur padding-top in Prozent)) über meinem Header. Nun will ich, dass, wenn man scrollt und der Header ganz oben ist, ein script über jQuery ausgrführt wird. Das würde ich normalerweise machen, indem ich .scrollTop() benutze, jedoch muss ich dort ja die Angaben in Pixel treffen (die Pixel wären dann die Höhe des Container über dem Header). Leider sind die je nach Bildschirmgröße unterschiedlich. Hat jemand ne Idee, wie ich das trotzdem lösen kann?
Ich hoffe, es ist verständlich. Wenn nicht, kann ich gerne Bilder machen, um es besser zu veranschaulichen.
Kommentar abgeben zu diesen Beitrag/Code ?Dann hier klicken
Der hier verwendete Code
<style>
header{
height:20vh;
width:100%;
background:#123456;
color:white;
text-align:center;
font-size:30px;
}
body{
height:1200px;
}
#fix{
position:fixed;
left:5px;
bottom:5px;
height:25px;
width:200px;
border:1px solid black;
font-size:25px;
}
</style>
<script src="/js_webseite/jquery.js"></script>
<header>Header</header>
<div id="fix">
</div>
<script>
var header_hohe=$('header').outerHeight();
$(window).scroll(function () {
if ($(this).scrollTop() < header_hohe) {
var hoch='Header ist da'
} else {
var hoch = $(window).scrollTop()-header_hohe;
}
$('#fix').html(hoch);
});
</script>