Blokowanie scrolla po przewinięciu określonej ilości px.

0

Witam,

Mam problem i nie bardzo wiem jak go rozwiązać. Otóż:

Chciałbym na mojej stronie blokować scrolowanie w dół po określonej ilości px. a dokładniej po dwukrotności wysokości okna.
Tak abym, mógł scrolować w dół dopóki osiągnę tą dwukrotność wysokości okna a potem scrolowanie możliwe jest wyłącznie w górę.

Czy ktoś ma pomysł jak to rozwiązać? Da się takie coś zrobić?

1

https://jsfiddle.net/dqxwcwsc/2/ łap fidla.

@k0nrad9 chesz zrobić PayToScroll?:D

0

Dzięki wielkie, jednak muszę prosić jeszcze o pomoc.

Chciałem sobie edytować funkcję tak aby działała u mnie na stronie.
Chciałem aby ta funkcja działała tylko na mojej pierwszej sekcji. Drugą mam obok i tam ma mi się scrolować normalnie. Dopisałem sobie takie coś:

 
jQuery(document).ready(function () {
  $('#wrapper').scroll(function () {
    var y = $(this).scrollLeft(); 
	if ( y<$(window).width()) {  
	
	$(function () {
    var windowHeight = $(window).height();
    var scrollPoint = 2160 - windowHeight;
    var scrolledPast = false;
     $('#wrapper').scroll(function () {
        if ($('#wrapper').scrollTop() > scrollPoint)
            scrolledPast = true &&  $('#wrapper').scrollTop(scrollPoint);
    }).scroll();
}); 

}
});  

}); 

jednak ten kod nie działa poprawnie, a w zasadzie wysypuje strone. Strona nie odpowiada.

Co zrobiłem źle? I jeszcze jedno pytanie jak poprawic ten kod tak aby scroll blokował się dopiero jak przejedzie dwukrotności wysokości ekranu? W moim przypadku 2160, jednak nie chciałbym tej wartości wpisywać "z ręki", ponieważ na monitorze innej rozdzielczości będzie to zle działało.
Próbowałem dać: var scrollPoint = 2* windowHeight - windowHeight; no ale to nie działa.

0
Desu napisał(a):

@k0nrad9 chesz zrobić PayToScroll?:D

Nie nie :P moja strona składa się z 5 divów na cały ekran które są rozmieszczone:
w pierwszej kolumnie 2 a w drugiej 3 no i chcę aby się w pierwszej kolumnie scrolowało tylko o te dwa divy, a obok normalnie do końca.
Są zrobione jeszcze ktowice do tego że uzyskuję fajny efekt przejścia po skosie. Dlatego myślę nad takim rozwiązaniem żeby blokować scroll. :)

1

Musisz mi wysłać jakieś zdjęcie albo dać link bo po tym kodzie który wrzuciłeś nie potrafię stwierdzić co chcesz zrobić :P Zanim Ci odpisze to popróbuj jeszcze sam.
Ta funkcja działa tak, że jak scrollujesz to sprawdza czy przekroczyłeś pewien punkt jeżeli tak to blokuje scroll poprzez scrollowanie (wracanie Cie) do tego właśnie punktu.

var scrollPoint = 2* windowHeight - windowHeight; WTF :D

  • windowHeight jest po to, że chciałem aby moje 1500 było na dole ekranu, bo gdy nie odjąłem tej wartości widziałem jeszcze 2100, bo 1500 było na górze (a granica przeciez 1500). Wystarczy, że zrobisz 2 * wh. Poeksperymentuj z wielokrotnoscia tej liczby.

Tak na marginesie to

$(function () { });

jest alias document.ready wiec nie musisz tego przepisywac dwa razy.

1 użytkowników online, w tym zalogowanych: 0, gości: 1