Ինչպես անջատել ոլորման տողերը: Ինչպես հեռացնել ոլորման գծերը

Ես օգտագործում եմ scrollTo jQuery plugin-ը և կցանկանայի իմանալ՝ կա՞ արդյոք որևէ միջոց՝ ժամանակավորապես անջատելու պատուհանի տարրի պտտումը Javascript-ի միջոցով: Պատճառը, որ ես կցանկանայի անջատել ոլորումը, այն է, որ scrollTo անիմացիայի ընթացքում ոլորելիս այն իսկապես տգեղ է դառնում ;)

իհարկե կարող էի $("body").css("overflow", "hidden"); և այնուհետև վերադարձրեք այն ավտոմատ ռեժիմին, երբ անիմացիան դադարեցվի, բայց ավելի լավ կլիներ, եթե ոլորման տողը դեռ տեսանելի լիներ, բայց ոչ ակտիվ:

* Օգտագործեք այն ժամանակ, երբ jQuery-ն աշխուժացնում է ոլորման դիրքը՝ երաշխավորված սուպեր սահուն զբոսանքի համար:

//Սառեցնել էջի բովանդակության ոլորման գործառույթը freeze() ( if($("html").css("position") != "fixed") ( var top = $("html").scrollTop() ? $(" html").scrollTop(). ", "scroll"); ) $("html").css(("width": "100%", "height": "100%", "position": "fixed", "top": -top )); , "ստատիկ" $("html, body").scrollTop(-parseInt($("html").css("top"))); "", "լայնություն": "", "բարձրություն": "", "վերև": "", "հորդառատ-y": ""));

այս կոդը հաշվի է առնում լայնությունը, բարձրությունը, ոլորման տողերը և էջի ցատկման խնդիրները:

վերը նշված կոդով լուծված հնարավոր խնդիրները.

• լայնությունը, ֆիքսված դիրք սահմանելիս html տարրի լայնությունը կարող է լինել 100%-ից պակաս
• բարձրությունը, նույնը, ինչ վերևում
• ոլորման տող, երբ դիրքը ֆիքսված է, էջի բովանդակությունն այլևս չունի ոլորման տող, նույնիսկ եթե այն ուներ ոլորման տող մինչև հորիզոնական էջերի ցատկում առաջացնելը:
• Pagejump, ֆիքսված դիրք սահմանելիս էջի scrollTop-ն այլևս չի գործում, ինչի արդյունքում առաջանում է ուղղահայաց էջատում

Եթե ​​որևէ մեկը վերը նշված էջի սառեցման/հալեցման կոդի բարելավումներ ունի, խնդրում եմ տեղեկացնել ինձ, որպեսզի ես կարողանամ այդ բարելավումները ավելացնել իմ նախագծին:

անջատել ոլորումը.

$(".popup").live(( popupbeforeposition.function(իրադարձություն, UI) ($("body").on("touchmove", false); ) ));

տարբերակի ոլորման ելնող պատուհանը փակելուց հետո.

$(".popup").live(( popupafterclose.function(իրադարձություն, UI) ($("body").unbind("touchmove"); ) ));

հաջորդ հատվածը (հետ օգտագործելով jquery) անջատելու է պատուհանի ոլորումը.

Var curScrollTop = $(window).scrollTop();

$("html").toggleClass ("noscroll").css ("վերև", "-" + curScrollTop + "px");

և ձեր css-ում.

Html.noscroll( դիրքը՝ ֆիքսված; լայնությունը՝ 100%, վերև՝ 0; ձախ՝ 0; բարձրություն՝ 100%, հորդառատ-y՝ ոլորել !կարևոր; z-ցուցիչ՝ 10; ) Այժմ, երբ դուք հեռացնում եք մոդալը, մի մոռացեք հեռացնել noscroll դասը:

html պիտակ

Document.onwheel = ֆունկցիա(e) ( // ստանալ թիրախային տարրը՝ target = e.target; // թիրախային տարրը կարող է լինել պտտվող տարրի երեխաները // օրինակ՝ «li»՝ «ul», «p» «s ներսում «div» և այլն: // մենք պետք է ստանանք մայր տարրը և ստուգենք, թե արդյոք այն ոլորելի է, // եթե ծնողը ոլորելի չէ, մենք շարժվում ենք դեպի հաջորդ ծնող, մինչդեռ (target.scrollHeight 0) ( էլ. .preventDefault() );

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua: Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat: Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, գտնվում է culpa qui officia deserunt mollit anim id est laborum:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua: Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat: Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, գտնվում է culpa qui officia deserunt mollit anim id est laborum:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua: Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat: Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, գտնվում է culpa qui officia deserunt mollit anim id est laborum:

Սա ամենապարզ լուծումն է, որը ես ստացել եմ մինչ այժմ: Եվ հավատացեք ինձ, ես փորձեցի բոլոր մյուսները, և սա ամենահեշտն է: Այն հիանալի է աշխատում Windows սարքերորը մղում է էջը դեպի աջ՝ տեղ բացելու համակարգի ոլորման տողի համար և iOS սարքերորոնք բրաուզերներում տեղ չեն պահանջում իրենց ոլորման գծերի համար: Այսպիսով, օգտագործելով սա, դուք ստիպված չեք լինի ավելացնել ներդիր աջ կողմում, որպեսզի էջը չթռչի, երբ դուք թաքցնում եք մարմինը կամ html հորդառատությունը՝ օգտագործելով CSS-ում:

Լուծումը բավականին պարզ է, եթե մտածեք դրա մասին: Գաղափարը տալն է

Ես գտա ավելի լավ, բայց խելագարված միջոց՝ համատեղելով sdleihssirhc-ի գաղափարը.

Window.onscroll = ֆունկցիա () ( window.scrollTo (window.scrollX, window.scrollY); //Կամ //window.scroll(window.scrollX, window.scrollY); //Կամ Հետադարձ //window.scrollX=պատուհան .scrollX; //window.scrollY=window.scrollY);

Ես այն չեմ փորձարկել, բայց ավելի ուշ կխմբագրեմ և կտեղեկացնեմ: Ես 85% վստահ եմ, որ այն աշխատում է հիմնական բրաուզերներում:

Այս հոդվածում դուք կսովորեք, թե ինչպես անջատել կամ միացնել Universal Apps (UWP) ոլորման գծերի ավտոմատ թաքցումը ձեր համար: հաշիվ Windows 10-ում

Օպերացիոն համակարգում, սկսած 1803 թվականից, մշակողները ավելացրել են մի տարբերակ, որը թույլ է տալիս անջատել ոլորման գծերի ավտոմատ թաքցումը և օգտակար կլինի հիմնականում այն ​​օգտվողների համար, ովքեր նախընտրում են, որ ոլորման գծերը միշտ տեսանելի լինեն UWP հավելվածներում (XAML) և

Կանխադրված օպերացիոն համակարգԹաքցնում է ոլորման տողերը, երբ մկնիկի ցուցիչը չի սավառնում դրանց վրա: Այս պարամետրի անջատումը հանգեցնում է նրան, որ UWP հավելվածներում (XAML) ոլորման տողերը և «Սկսել» ընտրացանկը կհայտնվեն որպես ոլորման տողեր իրենց լրիվ ընդլայնված չափով, նույնիսկ երբ դուք չեք շփվում դրանց հետ:

Ինչպես անջատել ոլորման գծերի ավտոմատ թաքցումը հավելվածում » Windows-ի կարգավորումներ»

Ավտոմատ թաքցվող ոլորման տողերն անջատելու համար կտտացրեք «Սկսել» կոճակը առաջադրանքների տողի վրա և ընտրեք կամ սեղմեք + I

Windows Settings հավելվածի պատուհանում, որը բացվում է, ընտրեք «Մատչելիություն» կատեգորիան

Հաջորդը, ընտրեք Ցուցադրել ներդիրը, իսկ պատուհանի աջ կողմում, «Պարզեցում» բաժնում և Windows-ի անհատականացում, անջատիչը դրեք Անջատված վիճակում:

Այժմ ոլորման տողերը միշտ կհայտնվեն Ունիվերսալ հավելվածներում (UWP), ինչպես նաև «Սկսել» ընտրացանկում, նույնիսկ եթե դուք չեք շփվում դրանց հետ:

Դուք կարող եք հետարկել փոփոխությունները՝ Windows-ի ավտոմատ թաքցնել ոլորման տողերը միացնելով միացնելով:

Ինչպես անջատել ռեեստրի խմբագրիչում ինքնաթաքնված ոլորման տողերը

Դուք կարող եք նաև անջատել ոլորման գծերի ավտոմատ թաքցումը, օգտագործելով Ռեեստրի խմբագրիչը: Բայց նախքան ռեեստրում որևէ փոփոխություն կատարելը, խորհուրդ է տրվում կամ արտահանել ռեեստրի բաժինը, որտեղ փոփոխությունները կատարվելու են:

Բացեք ռեեստրի խմբագրիչը՝ սեղմելով ստեղների համակցությունը + R և բացվող պատուհանում մուտքագրեք regedit և սեղմեք Մուտքագրեք բանալին↵ կամ օգտագործեք Windows որոնումը:

Ռեեստրի խմբագրիչի պատուհանում, որը բացվում է, անցեք հետևյալ ճանապարհին.

Հաջորդը, սեղմեք սեղմեք աջմկնիկը «Մատչելիություն» բաժնի վրա կամ աջ սեղմեք պատուհանի աջ կողմի դատարկ տարածքի վրա և համատեքստային մենյուԸնտրեք Նոր > DWORD (32-բիթ) արժեք: Անվանեք ստեղծված պարամետրը DynamicScrollbars

Այնուհետև կրկնակի սեղմեք ստեղծված DynamicScrollbars պարամետրի վրա և դրա արժեքը սահմանեք 0 և սեղմեք OK:

Փոփոխություններն ուժի մեջ են մտնում անմիջապես։

Ոլորման տողերի ավտոմատ թաքցումը միացնելու համար DynamicScrollbars-ը սահմանեք 1
  Բացի այդ, ավտոմատ թաքցնող ոլորման տողերն անջատելու համար կարող եք անել հետևյալը.

"DynamicScrollbars"=dword:00000000

Windows Registry Editor տարբերակ 5.00

"DynamicScrollbars"=dword:00000001

Ռեեստրի ֆայլերը կիրառելուց հետո դուք պետք է դուրս գաք և նորից մուտք գործեք, որպեսզի փոփոխություններն ուժի մեջ մտնեն:

Ինչպե՞ս անջատել ոլորումը:

Վարպետի պատասխանը.

Ոլորումն անհրաժեշտ է, երբ անհրաժեշտ է շրջել փաստաթղթում կամ կայքէջում, և դրանց չափը չի սահմանափակում էկրանի չափը: Կան ուղղահայաց և հորիզոնական ոլորումներ: Եթե ​​ոլորումն անջատված է, ռեսուրսների ամբողջական դիտումն անհնարին կդառնա:

Ոլորումը կարգավորելի կարգավորում է: Հիմնական կարգավորումները կարող են սահմանվել «Մկնիկի» միջոցով, և դրանք կկիրառվեն բոլոր հավելվածների վրա, իսկ ոլորման մեթոդը կարող է սահմանվել և չեղարկվել զննարկչի միջոցով: Այս կարգավորումները կաշխատեն ինտերնետում ճամփորդելիս:

Ինտերնետային ռեսուրսներ զննարկելիս սահուն ոլորումն անջատելու համար գործարկեք զննարկիչը և «Գործիքներ» ցանկում ընտրեք «Կարգավորումներ» բաժինը: Համար Internet Explorerսա կլինի «Գործիքներ» ցանկը և «Ինտերնետի ընտրանքներ» բաժինը: Եթե ​​ընտրացանկը չի ցուցադրվում, կտտացրեք զննարկչի պատուհանի վերևի կամ ներքևի վահանակի վրա և ցուցիչով նշեք «Մենյու տող» կամ «Մենյու բար» ենթակետը:

«Կարգավորումներ» պատուհանը բացելուց հետո անցեք «Ընդլայնված» ներդիր և ակտիվացրեք «Ընդհանուր» ենթաբաժինը: Գտեք «Կայքի դիտում» խումբը և հանեք «Օգտագործեք հարթ ոլորման» վանդակը, ապա սեղմեք «OK» կոճակը:

Ավտոմատ ոլորումն անջատելու համար հանեք «Օգտագործել ավտոմատ ոլորման» վանդակը: Internet Explorer-ի համար մեթոդը մի փոքր այլ կլինի. անհրաժեշտ է անցնել հասանելի կարգավորումների ցանկով, օգտագործելով ոլորման տողը, մինչև գտնվեն անհրաժեշտ տարրերը:

Ընդհանուր ոլորման կարգավորումները կարգավորելու համար եկեք դիմենք «Մկնիկ» բաղադրիչին, որի համար մենք անվանում ենք «Կառավարման վահանակ» («Սկսել» ընտրացանկից): Եկեք գնանք «Տպիչներ և այլ սարքավորումներ» կատեգորիա և սեղմենք «Մկնիկ» պատկերակը:

Կբացվի «Հատկություններ. մկնիկ» պատուհանը, որից հետո դուք պետք է անցնեք «Անիվ» ներդիր և կարգավորեք ոլորումը ձեր պահանջներին համապատասխան: «Էկրան» դաշտում դրված նշիչը պատկերը կտեղափոխի մոնիտորի վրայով էկրանի բարձրությանը հավասար հեռավորության վրա:

Եթե ​​այս պարամետրը մեզ համար չափազանց մեծ է, մենք կարող ենք նշիչ դնել «Նշված գծերի քանակի համար» դաշտում և մուտքագրել անհրաժեշտ արժեքը՝ օգտագործելով ստեղնաշարի կամ սլաքների կոճակները: «0» արժեքը չի կարող սահմանվել: Կիրառեք կատարված փոփոխությունները և փակեք պատուհանը:

Ես օգտագործում եմ scrollTo jQuery plugin-ը և կցանկանայի իմանալ՝ հնարավո՞ր է ժամանակավորապես անջատել Javascript-ի միջոցով պատուհանի տարրի ոլորումը: Պատճառը, որ ես կցանկանայի անջատել ոլորումը, այն է, որ երբ դուք ոլորում եք, երբ scrollTo ֆունկցիան շարժվում է, այն իսկապես տգեղ է դառնում:)

Իհարկե կարող էի $("body").css("overflow", "hidden"); և այնուհետև վերադարձրեք այն ավտոմատ ռեժիմին, երբ անիմացիան դադարեցվի, բայց ավելի լավ կլիներ, եթե ոլորման տողը դեռ տեսանելի լիներ, բայց ոչ ակտիվ:

Ոլորման իրադարձությունը չի կարող չեղարկվել: Բայց դա կարելի է անել՝ չեղարկելով փոխազդեցության հետևյալ իրադարձությունները.
Մկնիկի և հպման ոլորման և ոլորման հետ կապված կոճակներ:

Դա արեք՝ պարզապես մարմնին դաս ավելացնելով.

Stop-scrolling (բարձրությունը՝ 100%, վարարում՝ թաքնված; )

Ավելացրեք դաս և հեռացրեք այն, եթե ցանկանում եք նորից ակտիվացնել ոլորումը, որը փորձարկվել է IE, FF, Safari և Chrome-ում:

$("body").addClass("stop-scrolling")

Համար շարժական սարքերդուք պետք է կարգավորեք touchmove իրադարձությունը.

$("body").bind("touchmove", ֆունկցիա(e)(e.preventDefault()))

Ապա ամրացրեք՝ ոլորումը կրկին ակտիվացնելու համար: Փորձարկվել է iOS6-ում և Android 2.3.3-ում

$("body").unbind("touchmove")

Հաջորդ լուծումըհիմնական, բայց մաքուր JavaScript է (առանց jQuery).

Գործառույթ disableScrolling())(var x=window.scrollX; var y=window.scrollY; window.onscroll=function())(window.scrollTo(x, y); =ֆունկցիա()();

Կներեք հին գրառմանը պատասխանելու համար, բայց լուծում էի փնտրում և հանդիպեցի այս հարցին.

Այս խնդիրը լուծելու բազմաթիվ եղանակներ կան՝ ոլորման տողը դեռ ցուցադրելու համար, ինչպես օրինակ՝ բեռնարկղին 100% բարձրություն տալը և ոլորման ոճը:

Իմ դեպքում ես պարզապես ստեղծել եմ div ոլորման տողով, որը ցուցադրում եմ՝ ավելացնելով overflow: hidden to the body:

DisableScroll() ֆունկցիան (document.getElementById("scrollbar").style.display = "block"; document.body.style.overflow = "թաքնված"; )

Տարրի ոլորման տողը պետք է ունենա հետևյալ ոճերը.

Overflow-y: ոլորել; վերև՝ 0; աջ: 0; ցուցադրում՝ ոչ մի; բարձրությունը՝ 100%; դիրքը `ֆիքսված;

Մոխրագույն ոլորման սանդղակը ցուցադրված է այստեղ, հուսով ենք, որ այն կօգնի ապագա այցելուներին:

Համաձայն galambalazs-ի գրառման՝ ես կավելացնեի հպման սարքերի աջակցությունը, որը թույլ կտա մեզ դիպչել, բայց ոչ ոլորել վերև կամ վար:

ֆունկցիա disable_scroll() ( ... document.ontouchmove = ֆունկցիա(e)( e.preventDefault(); ) ) ֆունկցիա enable_scroll() ( ... document.ontouchmove = ֆունկցիա(e)( վերադարձ true; ) )

Ես փնտրում էի այս խնդրի լուծումը, բայց չբավարարվեցի վերը նշված լուծումներից (այս պատասխանը գրելու պահին), ուստի գտա այս լուծումը։

ScrollDisabled (դիրքը՝ ֆիքսված; լուսանցք՝ 0; // ջնջել JS-ի կողմից՝ acc-ը curr $(window).scrollTop() լայնությունը՝ 100%; )

Var y_offsetWhenScrollDisabled=0; ֆունկցիա disableScrollOnBody())( y_offsetWhenScrollDisabled= $(window).scrollTop();$("body").addClass("scrollDisabled").css("margin-top", -y_offsetWhenScrollDisabled); ) ֆունկցիա enableScrollOn())(Body): $( "body").removeClass("scrollDisabled").css("margin-top", 0.scrollTop(y_offsetWhenScrollDisabled));

Մեկ այլ լուծում.

Այս կերպ դուք միշտ ունեք ուղղահայաց ոլորման տող, բայց քանի որ իմ բովանդակության մեծ մասն ավելի երկար է, քան տեսադաշտը, դա ինձ համար լավ է: Բովանդակությունը կենտրոնացված է օգտագործելով անհատական ​​տարր div, բայց առանց մարմնի լուսանցքը վերականգնելու, իմ բովանդակությունը կմնա ձախ կողմում:

Սրանք երկու գործառույթներն են, որոնք ես օգտագործում եմ իմ թռուցիկ/մոդալը ցուցադրելու համար.

Var popup_bodyTop = 0; var popup_bodyLeft = 0; ֆունկցիա popupShow(id) ($("#"+ id).effect("fade"); $("#popup-overlay").effect("fade"); // հիշել ընթացիկ ոլորման դիրքը //, քանի որ երբ setting/unsetting position: fixed to body // the body will scroll to 0.0 popup_bodyLeft = $(document).scrollLeft(popup_bodyTop) = $(document) = - popup_bodyTop; $ ("body"). .css("left", x.toString() +"px" ) ֆունկցիա popupHide(id) ($("#"+ id).effect("fade"); $("#popup -overlay").effect ("fade") $("body").css("position", ""); ;

Արդյունք՝ չշարժվող ֆոն և բովանդակության վերադիրքավորում՝ ձախ ոլորման տողի պատճառով: Փորձարկվել է ընթացիկ FF-ի, Chrome-ի և IE 10-ի հետ:

Ինչ կասեք սրա մասին: (Եթե դուք օգտագործում եք jQuery)

Var $ պատուհան = $ (պատուհան); var $body = $(window.document.body); window.onscroll = function() ( var overlay = $body.children (".ui-widget-overlay").first(); // Ստուգեք, արդյոք ծածկույթը տեսանելի է և վերականգնել ոլորման նախորդ վիճակը, եթե (overlay.is( ":visible")) ( var scrollPos = $body.data("scroll-pos") || (x: 0, y: 0); window.scrollTo(scrollPos.x, scrollPos.y); ) else (/ / Պարզապես պահեք ոլորման վիճակը $body.data("scroll-pos", ( x: $window.scrollLeft(), y: $window.scrollTop() ) );

Կախված նրանից, թե ինչ եք ուզում հասնել հեռակառավարման միջոցով, դուք կարող եք պարզապես շտկել այն տարրը, որից ցանկանում եք հեռացնել ոլորումը (սեղմելով կամ ցանկացած գործարկիչի վրա, որը ցանկանում եք ժամանակավորապես անջատել ոլորումը)

Ես փնտրում էի «temp no scroll» լուծում և իմ կարիքների համար սա լուծեց այն

դաս անել

Ֆիքսված (դիրք՝ ֆիքսված; )

ապա Jquery-ի հետ

Var someTrigger = $("#trigger"); //a trigger button var contentContainer = $("#content"); //տարրը Ես ուզում եմ ժամանակավորապես հեռացնել ոլորումը contentContainer.addClass("notfixed"); //համոզվեք, որ տարրն ունի «notfixed» դասը //Something to trigger the fixed positioning: Այս դեպքում մենք ընտրեցինք կոճակ: someTrigger.on("click", function())( if(contentContainer.hasClass("չֆիքսված"))( contentContainer.removeClass("չֆիքսված").addClass("ֆիքսված"); )այլևս if(contentContainer.hasClass(" ֆիքսված "))( contentContainer.removeClass("ֆիքսված").addClass("չֆիքսված"); ));

Ես գտա, որ սա բավականին պարզ լուծում է, որը լավ է աշխատում բոլոր բրաուզերներում և նույնպես հարմար է հեշտ օգտագործման համարշարժական սարքերի վրա (օրինակ՝ iPhone, պլանշետներ և այլն): Քանի որ տարրը ժամանակավորապես ամրագրված է, ոլորում չկա :)

ՈՒՇԱԴՐՈՒԹՅՈՒՆ. Կախված ձեր «contentContainer» տարրի տեղադրությունից, գուցե անհրաժեշտ լինի այն հարմարեցնել ձախ կողմում: Ինչը կարելի է հեշտությամբ անել՝ ավելացնելով ձախը CSS արժեքըայս տարրին, երբ ֆիքսված դասը ակտիվ է

ContentContainer.css(( "left": $(window).width() - contentContainer.width()/2 //Սա կհանգեցնի արժեքի, որը պատուհանների ամբողջ լայնությունը հանած տարրը, որը մենք ցանկանում ենք «կենտրոնացնել» բաժանված է: երկու (քանի որ այն «միայն մի կողմից է հրվում) ));

Իմ jQuery թռուցիկ նախագծից https://github.com/seahorsepip/jPopup p>

//Սառեցնել էջի բովանդակության ոլորման գործառույթը freeze() ( if($("html").css("position") != "fixed") ( var top = $("html").scrollTop() ? $(" html").scrollTop(). ", "scroll"); ) $("html").css(("width": "100%", "height": "100%", "position": "fixed", "top": -top )); , "ստատիկ" $("html, body").scrollTop(-parseInt($("html").css("top"))); "", "լայնություն": "", "բարձրություն": "", "վերև": "", "հորդառատ-y": ""));

Այս կոդը հաշվի է առնում լայնության, բարձրության, ոլորման տողի և էջի ցատկի խնդիրները։

Վերոնշյալ կոդով լուծված հնարավոր խնդիրները.

• լայնությունը, ֆիքսված տեղադրման դիրքով, html տարրի լայնությունը կարող է լինել 100% -ից պակաս
• բարձրությունը նույնն է, ինչ վերևում
• ոլորման տող, երբ ֆիքսված դիրքում էջի բովանդակության դիրքն այլևս չունի ոլորման տող, նույնիսկ եթե այն ուներ ոլորման տող մինչև էջի ցատկումը տեղի ունենալը:
• pagejump, երբ դիրքի կարգավորումը ֆիքսված է, scrollTop-ն այլևս չի գործում, ինչի հետևանքով էջը ուղղահայաց ցատկում է

Եթե ​​որևէ մեկը վերը նշված էջի սառեցման/հալեցման կոդի բարելավումներ ունի, խնդրում եմ տեղեկացնել ինձ, որպեսզի ես կարողանամ այդ բարելավումները ավելացնել իմ նախագծին:

Chrome 56-ից և դրանից դուրս ժամանակակից բրաուզերներ, դուք պետք է ավելացնեք passive:false addEventListener զանգին, որպեսզի preventDefault-ը աշխատի: Այսպիսով, ես օգտագործում եմ սա բջջայինով ոլորելը դադարեցնելու համար.

PreventDefault(e)(e.preventDefault();) ֆունկցիա disableScroll())( document.body.addEventListener(«touchmove», preventDefault, (passive: false)); ) ֆունկցիա enableScroll())(document.body.removeEventListener («touchmove», preventDefault, (պասիվ՝ կեղծ));

Հիմնվելով Cheyenne Forbes-ի պատասխանի վրա, որը ես գտա այստեղ fcalderan-ի միջոցով. Պարզապես անջատել ոլորումը, չթաքցնել: և ուղղեք ոլորման տողի անհետացման խնդիրը Hallodom-ում

Preventscroll (դիրք՝ ֆիքսված; ողողում-y: ոլորում; )

Whatever.onclick = ֆունկցիա())( $("body").addClass("preventscroll"); ) whatevertoclose.onclick = function()) ($("body").removeClass("preventscroll"); )

Այս կոդը ձեզ տանում է էջի վերևում, բայց ես կարծում եմ, որ fcalderan-ի կոդը լուծում ունի:

Ես նույն խնդիրն ունեմ, ստորև ներկայացված է դրա լուծման ճանապարհը.

/* file.js */ var body = document.getElementsByTagName("body"); //եթե պատուհանը չի պտտվում body.classList.add("no-scroll"); //if window scroll body.classList.remove("no-scroll"); /* file.css */ .no-scroll( դիրքը՝ ֆիքսված; վերև՝ 0; ներքև՝ 0; ձախ՝ 0; աջ՝ 0; )

հուսով եմ, որ սա օգնում է:

Ամենահեշտ ճանապարհը.

$("body").css ("հորդառատ", "թաքնված"); // Ժամանակավորապես հեռացնել ոլորման տողը

Սա չեղարկելու համար՝

$("body").css("overflow", "auto");

Հեշտ է իրականացնել, բայց միակ թերությունն այն է.

• Էջը մի փոքր կտեղափոխվի դեպի ձախ, եթե կենտրոնացված լինի (հորիզոնական):

Դա պայմանավորված է նրանով, որ ոլորման տողը հեռացվել է, իսկ տեսադաշտը մի փոքր ավելի լայնացել է:

Ահա իմ լուծումը դադարեցնել ոլորումը (առանց jQuery): Ես այն օգտագործում եմ ոլորումն անջատելու համար, երբ հայտնվում է կողմնակի ընտրացանկը:

Անջատել/Միացնել scroll var noscroll_var; ֆունկցիա noscroll())( if(noscroll_var)( document.getElementsByTagName("html").style.overflowY = ""; document.body.style.paddingRight = "0"; noscroll_var = false )else( document.getElementsByTagName(" html ").setAttribute("style", "overflow-y: թաքնված !կարեւոր"); document.body.style.paddingRight = "17px"; noscroll_var = true) )/*noscroll()*/ for(var i= 0; i