Hallo miteinander sehr kleines Problem, also es geht darum, dass ich die normale Scrollbar vom Browser durch eine individuelle ersetze, dass leider nicht durch bloßem CSS, da dies nicht jeder Browser unterstützt.
Also habe ich eine Function zum initieren von Scrollelementen gebastelt, da würde ich auch zum Punkt kommen, wir haben hier 'ne simple spartanische Inition
@:js();@ ist übrigens eine kleine Funktionsparsing Idee von mir ist einwenig unnötig, aber es funktioniert.
so nun haben wir zack zack zack meine kleine Denkaktion, da kommen wir schon zum Problem scrollthumb ist mit pointer-events: none; ausgestattet, die Frage warum, ja man soll damit wohl angenehmer scrollen vorallem wegen dem ziehen danach, ja man kann auch einfach die selection deaktivieren, aber das ist nun erstmal egal, da habe ich Testweise die Pointer events raus gelassen.. mein eig. Problem ist ja, dass beim ziehen die scrollbar in die richtige Richtung soll mousedown Events haben mir nicht viel gebracht Bsp.
diese Funktion ist totaler Bullshit da es mir beim mousedown die letzte Position ermittelt heißt also wenn ich plötzlich nun hochfahre mit der Maus scrollt es nicht mehr nach oben..
Nun kamen mir setTimeout oder setIntervals in den Sinn.. naja da war's auch einwenig fail.. hoffentlich konnte ich euch das Problem ermitteln und würde mich über einen Denkansatz freuen
Kurz: Beim scroll Event möchte ich den Scrollbalken in die richtige Richtung führen, als alternative habe ich nun 2x Pfeile eines das nach oben zeigt, das andere zeigt nach unten.. den Rest kann man sich ja denken ziemlich unpraktisch eine nicht klickbar scrollbare Scrollbar, auf JS Engines verzichte ich übrigens, da ich einer bin der im Selfmade mode ist bei klein arbeiten.
Vielen Dank schonmal wenn jemand bis zum Ende kam und mir folgen konnte.
Also habe ich eine Function zum initieren von Scrollelementen gebastelt, da würde ich auch zum Punkt kommen, wir haben hier 'ne simple spartanische Inition
Code:
<div class="scrollarea"> <div class="scrollcontent"> <div style="height:5000px;position:relative;">ja da wird gescrollt... </div> </div> <div class="scrollbar"> <div class="scrollthumb" style="@:js('scrollheight');@"></div> </div> </div>
so nun haben wir zack zack zack meine kleine Denkaktion, da kommen wir schon zum Problem scrollthumb ist mit pointer-events: none; ausgestattet, die Frage warum, ja man soll damit wohl angenehmer scrollen vorallem wegen dem ziehen danach, ja man kann auch einfach die selection deaktivieren, aber das ist nun erstmal egal, da habe ich Testweise die Pointer events raus gelassen.. mein eig. Problem ist ja, dass beim ziehen die scrollbar in die richtige Richtung soll mousedown Events haben mir nicht viel gebracht Bsp.
Code:
<script> var LastmousePos; scrollbar.addEventListener("mousedown", function(e){ LastmousePos = mousePosY(); this.onmousemove = function(e){ var NowMousePos = mousePosY(); if(NowMousePos > LastmousePos){ var ScrollTop = NowMousePos - LastmousePos; scrollbar.style.top = ScrollTop + "px"; } else { var ScrollTop = LastmousePos - NowMousePos; scrollbar.style.top = ScrollTop + "px"; } } },false) </script>
Nun kamen mir setTimeout oder setIntervals in den Sinn.. naja da war's auch einwenig fail.. hoffentlich konnte ich euch das Problem ermitteln und würde mich über einen Denkansatz freuen
Kurz: Beim scroll Event möchte ich den Scrollbalken in die richtige Richtung führen, als alternative habe ich nun 2x Pfeile eines das nach oben zeigt, das andere zeigt nach unten.. den Rest kann man sich ja denken ziemlich unpraktisch eine nicht klickbar scrollbare Scrollbar, auf JS Engines verzichte ich übrigens, da ich einer bin der im Selfmade mode ist bei klein arbeiten.
Vielen Dank schonmal wenn jemand bis zum Ende kam und mir folgen konnte.
Kommentar