কীভাবে প্রোগ্রামে jQuery এর সাথে পৃষ্ঠা স্ক্রোলিং অক্ষম করবেন


163

JQuery ব্যবহার করে, আমি শরীরের স্ক্রোলিং অক্ষম করতে চাই:

আমার ধারণাটি হ'ল:

  1. সেট body{ overflow: hidden;}
  2. কারেন্টটি ক্যাপচার করুন scrollTop();/scrollLeft()
  3. বডি স্ক্রোল ইভেন্টের সাথে আবদ্ধ করুন, ক্যাপচারিত মানটিতে স্ক্রোলটপ / স্ক্রোললিফ্ট সেট করুন।

একটি ভাল উপায় আছে কি?


হালনাগাদ:

Http://jsbin.com/ikuma4/2/edit এ দয়া করে আমার উদাহরণ এবং একটি কারণ দেখুন

আমি সচেতন যে কেউ ভাবতে থাকবে "তিনি কেন কেবল position: fixedপ্যানেলে ব্যবহার করেন না?"

আমার অন্যান্য কারণ রয়েছে বলে দয়া করে এটি প্রস্তাব করবেন না।


7
"একটি ভাল উপায় আছে কি?" - ব্রাউজারটি স্বাভাবিকভাবে আচরণ করা দেওয়া ছাড়া অন্য কি?
ফেন্টন

22
"melodramatically"?
মাইক ওয়েলার

6
সম্ভবত প্রোগ্রামগতভাবে বোঝানো? যেহেতু এটি 'প্রোগ্রাম্যাটিকভাবে' জন্য ফায়ারফক্স শীর্ষ বানান সংশোধন পরামর্শ
মাইকেল শিম্মিনস

4
এই থ্রেডটি চলছে \ b \
সিপ্পি

3
@ সোহনি স্ক্রোলিং অক্ষম করছে! == খারাপ
ম্যানসিম্যানস

উত্তর:


136

এটি করার একমাত্র উপায়টি আপনি যা বর্ণনা করেছেন তার সাথে মিলে যায়:

  1. বর্তমান স্ক্রোল অবস্থানটি ধরুন (অনুভূমিক অক্ষটি ভুলে যাবেন না!)।
  2. ওভারফ্লো গোপনে সেট করুন (সম্ভবত পূর্ববর্তী ওভারফ্লো মান ধরে রাখতে চান)।
  3. স্ক্রোলটি () এর সাহায্যে সজ্জিত স্ক্রোল অবস্থানে ডকুমেন্ট স্ক্রোল করুন।

তারপরে আপনি যখন আবার স্ক্রোলিংয়ের অনুমতি দেওয়ার জন্য প্রস্তুত হবেন তখন সমস্ত কিছু পূর্বাবস্থায় ফেরাবেন।

সম্পাদনা করুন: কোনও কারণ ছাড়াই আমি আপনাকে কোডটি দিতে পারছি না কারণ আমি এটি খনন করতে সমস্যায় পড়েছি ...

// lock scroll position, but retain settings for later
var scrollPosition = [
  self.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft,
  self.pageYOffset || document.documentElement.scrollTop  || document.body.scrollTop
];
var html = jQuery('html'); // it would make more sense to apply this to body, but IE7 won't have that
html.data('scroll-position', scrollPosition);
html.data('previous-overflow', html.css('overflow'));
html.css('overflow', 'hidden');
window.scrollTo(scrollPosition[0], scrollPosition[1]);


// un-lock scroll position
var html = jQuery('html');
var scrollPosition = html.data('scroll-position');
html.css('overflow', html.data('previous-overflow'));
window.scrollTo(scrollPosition[0], scrollPosition[1])

2
দয়া করে jsbin.com/ikuma4/2/edit দেখুন এবং কোন কারণ ব্যাখ্যা করুন যে আপনার চেয়ে ভাল? আমি কি কিছু মিস করছি (আমার উদাহরণের তুলনায় আপনার উত্তরটির দৈর্ঘ্যের কোনও কারণ আমি দেখতে পাচ্ছি না বলে জিজ্ঞাসা করি)
হাইলউড

3
আপনার পদ্ধতি আই 7 তে কাজ করে না। আমিও প্রথম চেষ্টা করেছিলাম। সমস্যাটি হ'ল এটি খুব দ্রুত স্ক্রোল ইভেন্টে প্রতিক্রিয়া জানায় না। এটি ডকুমেন্টটিকে স্ক্রোল করতে দেয়, তারপরে আপনার জেএস যেখানে যেখানে চান সেখানে স্ক্রোলের অবস্থানটি পুনরায় সেট করলে এটি আবার ফিরে আসে।
tfe

1
এছাড়াও, যদি দেহে অন্য কিছু বাদ দিয়ে ওভারফ্লো হয় autoতবে তা ওভাররাইট করা হবে। আমার বিদ্যমান সেটিংটি সংরক্ষণ করার দরকার ছিল, যাতে এটি কিছুটা ওভারহেডও যুক্ত করে।
tfe

কেবল স্টাইলিং htmlএবং এর bodyসাথে overflow: hiddenঅপর্যাপ্ত কেন কেউ জানেন ? আমরা এখনও ইভেন্ট হ্যান্ডলার প্রয়োজন শেষ।
কেপোজিন

4
এটি একটি দুর্দান্ত উত্তর। এবং এটি টাচ ডিভাইসে কাজ করার জন্য, এই উত্তরটি দেখুন।
প্যাট্রিক

235

এটি সম্পূর্ণরূপে স্ক্রোলিং অক্ষম করবে :

$('html, body').css({
    overflow: 'hidden',
    height: '100%'
});

পুনঃস্থাপন করা:

$('html, body').css({
    overflow: 'auto',
    height: 'auto'
});

এটি ফায়ারফক্স এবং ক্রোমে পরীক্ষিত।


18
প্রত্যাশার মতো কাজ করে। ধন্যবাদ! এই গ্রহণযোগ্য উত্তর হওয়া উচিত ছিল!
ডেভ চেন

6
ক্রোমে মাঝারি মাউস বোতামটির সাথে এখনও স্ক্রোল।
লোথার

16
এটি বর্তমান স্ক্রোল অবস্থান হারায়। ওপি স্পষ্টভাবে স্ক্রোল অবস্থান ক্যাপচার সম্পর্কে উল্লেখ করেছে, তাই আমি ধরে নিই যে তার এটির প্রয়োজন ছিল। যাইহোক, আমার এটির প্রয়োজন, তাই এটি আমার কাছে সীমিত ব্যবহার
zerm

7
পিএস ছাড় দেওয়া height: 100%কার্যকরভাবে ঝাঁপুনি ছাড়াই বর্তমান অবস্থানে স্ক্রোলিংটি লক করে রাখে - অন্তত সর্বশেষতম ক্রোমে।
জের্ম

2
এটি সঠিক উত্তর নয়। স্ক্রোল অবস্থানটি ক্যাপচার করা হয়নি
টেলোরক্র্যাসি

43

এটা চেষ্টা কর

$('#element').on('scroll touchmove mousewheel', function(e){
  e.preventDefault();
  e.stopPropagation();
  return false;
})

আমি যা খুঁজছিলাম ... প্রায়। যাইহোক তীর কীগুলির সময় এটি অক্ষম করবেন?
কোডি

2
@ কোডি - এটি CSS এর ওভারফ্লোতে একত্রিত করুন: লুকানো
দারিয়াস.ভি

2
@ কুবিউ কীভাবে এটি বিপরীত করবেন?
মেরার

3
আপনি ব্যবহার করতে পারেন$('#element').off('scroll touchmove mousewheel');
arnuschky

1
দুর্দান্ত সমাধান। যদিও আপনি কীভাবে কেবল bodyস্ক্রোলিং অক্ষম করবেন তবে অন্যান্য শিশু উপাদানগুলির মধ্যে স্ক্রোলিংয়ের অনুমতি দেবেন overflow: scroll?
ফিজিক্স

27

আমি কেবল tfe দ্বারা সমাধানের জন্য একটু টিউনিং সরবরাহ করি । বিশেষত, যখন স্ক্রোলবার সেট করা থাকে তখন পৃষ্ঠার সামগ্রী (ওরফে পৃষ্ঠা শিফট ) কোনও স্থানান্তরিত হয় না তা নিশ্চিত করতে আমি কিছু অতিরিক্ত নিয়ন্ত্রণ যুক্ত করেছি hidden

দুটি জাভাস্ক্রিপ্ট ফাংশন lockScroll()এবং unlockScroll()পৃষ্ঠা স্ক্রোলটি লক এবং আনলক করতে যথাক্রমে সংজ্ঞায়িত করা যায়।

function lockScroll(){
    $html = $('html'); 
    $body = $('body'); 
    var initWidth = $body.outerWidth();
    var initHeight = $body.outerHeight();

    var scrollPosition = [
        self.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft,
        self.pageYOffset || document.documentElement.scrollTop  || document.body.scrollTop
    ];
    $html.data('scroll-position', scrollPosition);
    $html.data('previous-overflow', $html.css('overflow'));
    $html.css('overflow', 'hidden');
    window.scrollTo(scrollPosition[0], scrollPosition[1]);   

    var marginR = $body.outerWidth()-initWidth;
    var marginB = $body.outerHeight()-initHeight; 
    $body.css({'margin-right': marginR,'margin-bottom': marginB});
} 

function unlockScroll(){
    $html = $('html');
    $body = $('body');
    $html.css('overflow', $html.data('previous-overflow'));
    var scrollPosition = $html.data('scroll-position');
    window.scrollTo(scrollPosition[0], scrollPosition[1]);    

    $body.css({'margin-right': 0, 'margin-bottom': 0});
}

যেখানে আমি ধরে নিয়েছিলাম যে <body>এর কোনও প্রাথমিক মার্জিন নেই।

লক্ষ্য করুন যে উপরের সমাধানটি বেশিরভাগ ব্যবহারিক ক্ষেত্রে ব্যবহার করে, এটি নির্দিষ্ট নয় কারণ এটি পৃষ্ঠাগুলির জন্য আরও কিছু কাস্টমাইজেশন প্রয়োজন, উদাহরণস্বরূপ, যার সাথে একটি শিরোনাম রয়েছে position:fixed। একটি উদাহরণ সহ এই বিশেষ ক্ষেত্রে যেতে দিন। ধরুন

<body>
<div id="header">My fixedheader</div>
<!--- OTHER CONTENT -->
</body>

সঙ্গে

#header{position:fixed; padding:0; margin:0; width:100%}

তারপর, এক ফাংশন নিম্নোক্ত যোগ করা উচিত lockScroll()এবং unlockScroll():

function lockScroll(){
    //Omissis   


    $('#header').css('margin-right', marginR);
} 

function unlockScroll(){
    //Omissis   

    $('#header').css('margin-right', 0);
}

শেষ অবধি, মার্জিন বা প্যাডিংয়ের জন্য কিছু সম্ভাব্য প্রাথমিক মানের যত্ন নিন।


4
আপনার জাভাস্ক্রিপ্ট-বডিএসএসএস (margin 'মার্জিন-ডান': 0, 'মার্জিন-ডাউন', 0}) এ আপনার একটি ত্রুটি রয়েছে; $ বডি.সিএস (margin 'মার্জিন-ডান': 0, 'মার্জিন-ডাউন': 0}) হওয়া উচিত;
জোহানসার্ক

আসলে, কেবল ব্যবহার করুন marginRightএবং marginLeft:)
মার্টিজন

25

আপনি এই কোডটি ব্যবহার করতে পারেন:

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

8
আপনি এখনও স্ক্রোল করতে মাঝের মাউস বোতামটি ব্যবহার করতে পারেন।
রজার ফার

2
না, এটি ঠিক আছে এবং এর সাথে কোনও স্ক্রোল নেই!
মিঃসোর্স

আপনি যদি কিছু অতিরিক্ত সিএসএস ব্যবহার করেন তবে আপনি স্ক্রোলিং পুরোপুরি অক্ষম করতে পারেন, আরও তথ্যের জন্য আমার উত্তর দেখুন।
গীতারিক

21

স্ক্রোলিং বন্ধ করার জন্য এটি ব্যবহার করে দেখুন:

var current = $(window).scrollTop();
$(window).scroll(function() {
    $(window).scrollTop(current);
});

পুনঃ স্থাপন করতে:

$(window).off('scroll');

আমার যা প্রয়োজন তার জন্য এটি ছিল দুর্দান্ত সমাধান।
টেরি কার্টার

@ এভরিস্ক্রিমার না, এটি স্ক্রিনটিকে পাগলের মতো কাঁপিয়ে তোলে। একটি workaround সন্ধান করার চেষ্টা করছেন।
টেলারিয়ান

5

আমি এটি হ্যান্ডল করার জন্য একটি jQuery প্লাগইন লিখেছি: is .ডিসিবল স্ক্রোল

এটি মাউসওয়েল, টাচমোভ এবং কী কী চাপার ইভেন্টগুলি থেকে স্ক্রোলিং প্রতিরোধ করে Page Down

এখানে একটি ডেমো আছে

ব্যবহার:

$(window).disablescroll();

// To re-enable scrolling:
$(window).disablescroll("undo");

আমি আপনার ডিজেবল স্ক্রোল () প্লাগইনটি মৌসুম / স্ক্রোল ইভেন্ট শুনে অস্থায়ীভাবে স্ক্রোলিং অক্ষম করতে ব্যবহার করার চেষ্টা করেছি, তবে এটি কার্যকর হয় না। আপনি যে প্রভাব অর্জনের জন্য কোনও উপায় জানেন?
হলুদ-সন্ত

@ জেবি আমি সম্ভবত সাহায্য করতে পারি তবে মন্তব্যগুলি সবচেয়ে ভাল জায়গা নয়। এই স্ট্যাক ওভারফ্লো চ্যাটে আমাকে যোগদান করুন এবং আমি কী করতে পারি তা দেখতে পাব: chat.stackoverflow.com/rooms/55043/disablescrol-usage
জোশ হ্যারিসন

আমি দুঃখিত, তবে এই প্লাগইনটি আপনার jsfiddle এ কাজ করে না।
চিহ্নজ

আপনি কোন ব্রাউজার / প্ল্যাটফর্মটি দয়া করে কাজ করে না বলে মনে করে আমাকে এটি পরিদর্শন করতে সহায়তা করতে পারেন?
জোশ হ্যারিসন

5

ইভেন্টগুলি স্ক্রোল করার জন্য আপনি কোনও ফাংশন সংযুক্ত করতে পারেন এবং এর ডিফল্ট আচরণ আটকাতে পারেন।

var $window = $(window);

$window.on("mousewheel DOMMouseScroll", onMouseWheel);

function onMouseWheel(e) {
    e.preventDefault();
}

https://jsfiddle.net/22cLw9em/


1
এটি সঠিক উত্তর। কেন এটি সেট হিসাবে সেট করা হয় তা জানেন না
গিলহেরেম ফেরেরিরা


4

মাঝের মাউস বোতাম সহ স্ক্রোলিং অক্ষম করতে একটি লাইনার।

$(document).scroll(function () { $(document).scrollTop(0); });

সম্পাদনা করুন : ভ্যানিলা জেএস (উপরে কোনও ফ্রেমওয়ার্ক নয়, কেবল জাভাস্ক্রিপ্ট) এর অর্থ নীচে নীচে নীচে নীচে জিকুয়ের কোনও প্রয়োজন নেই:

document.addEventListener('scroll', function () { this.documentElement.scrollTop = 0; this.body.scrollTop = 0; })

this.docamentElement.scrolTop - মানক

this.body.scrolTop - IE সামঞ্জস্য



3

আপনি কি কেবল শরীরের উচ্চতা 100% এবং ওভারফ্লো লুকিয়ে রাখতে পারবেন না? Http://jsbin.com/ikuma4/13/edit দেখুন


$ ("এইচটিএমএল")। সিএসএস ({উচ্চতা: '100%', ওভারফ্লো: 'লুকানো'}); এটি সহজভাবে কাজ করে, আপনাকে ধন্যবাদ অ্যাড্রিয়ান
আলেক্সি

3

এই কোডটি কেউ পোস্ট করেছেন, যা পুনরুদ্ধারকালে স্ক্রোল অবস্থানটি ধরে রাখার সমস্যা নেই। কারণটি হ'ল লোকেরা এটি এইচটিএমএল এবং দেহ বা কেবলমাত্র দেহে প্রয়োগ করে তবে এটি কেবল এইচটিএমএল এ প্রয়োগ করা উচিত। পুনরুদ্ধার করার পরে এইভাবে স্ক্রোলের অবস্থানটি রাখা হবে:

$('html').css({
    'overflow': 'hidden',
    'height': '100%'
});

পুনঃস্থাপন করা:

$('html').css({
    'overflow': 'auto',
    'height': 'auto'
});

'overflow': 'auto',ব্যবহার করবেন না'overflow': 'initial',
evtuhovdo

2

এটি আপনার উদ্দেশ্যে কাজ করতে পারে বা নাও পারে তবে আপনি jScrolPane এর স্ক্রোলিংয়ের আগে অন্যান্য কার্যকারিতা চালিত করতে প্রসারিত করতে পারেন । আমি কেবল এটি সামান্য পরীক্ষা করেছি, তবে আমি নিশ্চিত হতে পারি যে আপনি ঝাঁপিয়ে পড়ে পুরোপুরি স্ক্রোলিং প্রতিরোধ করতে পারেন। আমি যা করেছি তা হ'ল:

  • ডেমো জিপটি ডাউনলোড করুন: http://github.com/vitch/jScrollPane/archives/master
  • "ইভেন্টস" ডেমো খুলুন (ইভেন্টস html)
  • নন-মিনিফাইড স্ক্রিপ্ট উত্সটি ব্যবহার করতে এটি সম্পাদনা করুন: <script type="text/javascript" src="script/jquery.jscrollpane.js"></script>
  • Jquery.jscrollpane.js এর মধ্যে একটি "রিটার্ন" প্রবেশ করান line 666 লাইনে (শুভ লাইন নম্বর! তবে যদি আপনার সংস্করণটি কিছুটা আলাদা হয় তবে এটি positionDragY(destY, animate)ফাংশনের প্রথম লাইন

ইভেন্টগুলি html ফায়ার করুন এবং আপনি একটি সাধারণভাবে স্ক্রোলিং বাক্স দেখতে পাবেন যা আপনার কোডিংয়ের হস্তক্ষেপের কারণে স্ক্রোল করবে না।

আপনি পুরো ব্রাউজারের স্ক্রোলবারগুলি এইভাবে নিয়ন্ত্রণ করতে পারেন (পূর্ণ পৃষ্ঠা_স্ক্রোল। Html দেখুন)।

সুতরাং, সম্ভবত পরবর্তী পদক্ষেপটি হল অন্য কোনও ফাংশনে একটি কল যুক্ত করা যা বন্ধ হয়ে যায় এবং আপনার অ্যাঙ্করিং ম্যাজিক করে, তখন সিদ্ধান্ত নেয় যে স্ক্রোলটি চালিয়ে যাওয়া হবে কিনা। স্ক্রোলটপ এবং স্ক্রোললিফ্ট সেট করার জন্য আপনার কাছে এপিআই কলগুলিও রয়েছে।

আপনি যদি আরও সহায়তা চান তবে যেখানে পৌঁছবেন সেখানে পোস্ট করুন!

আশা করি এটি সাহায্য করেছে।


2

আমি এখানে একটি উত্তর রেখেছি যা এখানে সহায়তা করতে পারে: jQuery সরলমডাল স্ক্রলিং অক্ষম করে

এটি দেখায় যে কীভাবে পাঠ্যটি চারপাশে না সরিয়ে স্ক্রোল বারগুলি বন্ধ করবেন। আপনি সাদামাটা সম্পর্কে অংশ উপেক্ষা করতে পারেন।


1

আপনি যদি কেবল কীবোর্ড নেভিগেশন দিয়ে স্ক্রোলিং অক্ষম করতে চান তবে আপনি কীডাউন ইভেন্টটি ওভাররাইড করতে পারেন।

$(document).on('keydown', function(e){
    e.preventDefault();
    e.stopPropagation();
});

1

এই কোড ব্যবহার করে দেখুন:

    $(function() { 
        // ...

        var $body = $(document);
        $body.bind('scroll', function() {
            if ($body.scrollLeft() !== 0) {
                $body.scrollLeft(0);
            }
        });

        // ...
    });

0

কোনও পৃষ্ঠায় লিখিত সামগ্রীর স্ক্রোলিং প্রতিরোধের জন্য আপনি স্ক্রোলযোগ্য ডিভি দিয়ে উইন্ডোটি কভার আপ করতে পারেন। এবং লুকিয়ে রেখে দেখিয়ে আপনি আপনার স্ক্রোলটি লক / আনলক করতে পারেন।

এরকম কিছু করুন:

#scrollLock {
    width: 100%;
    height: 100%;
    position: fixed;
    overflow: scroll;
    opacity: 0;
    display:none
}

#scrollLock > div {
    height: 99999px;
}

function scrollLock(){
    $('#scrollLock').scrollTop('10000').show();
}

function scrollUnlock(){
    $('#scrollLock').hide();
}

7
"ইউ" এবং "স্মিথ" এর মতো সংক্ষিপ্ত বিবরণ ব্যবহার করবেন না। পাঠযোগ্যতার জন্য সঠিকভাবে বানান করতে সময় নিন।
টিন ম্যান

0

যেসব কেন্দ্রীকৃত বিন্যাসগুলি (মাধ্যমে margin:0 auto;) রয়েছে তাদের জন্য, এখানে @tfe এর প্রস্তাবিত সমাধানের position:fixedসাথে সমাধানটির একটি ম্যাশ-আপ ।

আপনি যদি পৃষ্ঠা-স্নেপিংয়ের অভিজ্ঞতা নিচ্ছেন (স্ক্রোলবারটি দেখানোর / লুকানোর কারণে) এই সমাধানটি ব্যবহার করুন।

// lock scroll position, but retain settings for later
var scrollPosition = [
    window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft,
    window.pageYOffset || document.documentElement.scrollTop  || document.body.scrollTop
];
var $html = $('html'); // bow to the demon known as MSIE(v7)
$html.addClass('modal-noscroll');
$html.data('scroll-position', scrollPosition);
$html.data('margin-top', $html.css('margin-top'));
$html.css('margin-top', -1 * scrollPosition[1]);

…সংযুক্ত…

// un-lock scroll position
var $html = $('html').removeClass('modal-noscroll');
var scrollPosition = $html.data('scroll-position');
var marginTop = $html.data('margin-top');
$html.css('margin-top', marginTop);
window.scrollTo(scrollPosition[0], scrollPosition[1])

… এবং পরিশেষে, এর জন্য সিএসএস .modal-noscroll...

.modal-noscroll
{
    position: fixed;
    overflow-y: scroll;
    width: 100%;
}

আমি বলতে এই অন্যান্য সমাধানের কোন সেখানে আউট তুলনায় সঠিক ফিক্স এর বেশি হয় venture হবে, কিন্তু আমি এটা পরীক্ষিত নি যে পুঙ্খানুপুঙ্খভাবে এখনো ...: পি


সম্পাদনা করুন: দয়া করে নোট করুন যে এটি কোনও স্পর্শ ডিভাইসে কীভাবে খারাপভাবে সঞ্চালন করতে পারে (পড়ুন: ফুটিয়ে তোলা) আমার কোনও ধারণা নেই।


0

এটি করার জন্য আপনি ডোমও ব্যবহার করতে পারেন। বলুন যে আপনি এখানে কল করেছেন এমন কোনও ফাংশন রয়েছে:

function disable_scroll() {
document.body.style.overflow="hidden";
}

আর এটুকুই আছে! আশা করি এটি অন্যান্য সমস্ত উত্তর ছাড়াও সহায়তা করবে!


0

এটিই আমি শেষ করেছিলাম:

CoffeeScript:

    $("input").focus ->
        $("html, body").css "overflow-y","hidden"
        $(document).on "scroll.stopped touchmove.stopped mousewheel.stopped", (event) ->
            event.preventDefault()

    $("input").blur ->
        $("html, body").css "overflow-y","auto"
        $(document).off "scroll.stopped touchmove.stopped mousewheel.stopped"

javascript:

$("input").focus(function() {
 $("html, body").css("overflow-y", "hidden");
 $(document).on("scroll.stopped touchmove.stopped mousewheel.stopped", function(event) {
   return event.preventDefault();
 });
});

$("input").blur(function() {
 $("html, body").css("overflow-y", "auto");
 $(document).off("scroll.stopped touchmove.stopped mousewheel.stopped");
});

0

কেউ আমার সমাধান চেষ্টা করে দেখেছেন কিনা তা নিশ্চিত নন। এটি একটি পুরো শরীর / এইচটিএমএল এ কাজ করে তবে সন্দেহ নেই যে এটি কোনও স্ক্রোল ইভেন্টে আগুন লাগা এমন কোনও উপাদানকে প্রয়োগ করা যেতে পারে।

আপনার প্রয়োজন অনুসারে কেবল স্ক্রোললক সেট এবং আনসেট করুন।

var scrollLock = false;
var scrollMem = {left: 0, top: 0};

$(window).scroll(function(){
    if (scrollLock) {
        window.scrollTo(scrollMem.left, scrollMem.top);
    } else {
        scrollMem = {
            left: self.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft,
            top: self.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
        };
    }
});

এখানে উদাহরণস্বরূপ জেএসফিডাল

আশা করি এটি কাউকে সাহায্য করবে।


এটি একটি ব্যতিক্রম ব্যতীত এটি হিসাবে এটি কাজ করে। যখন স্ক্রোলটি লক হয়ে গেছে, এবং আমি স্ক্রোল করব, আসলে স্ক্রোলটি লক করার আগে এটি কিছুটা
পঁচাচ্ছে

0

আমি মনে করি সর্বোত্তম এবং পরিষ্কার সমাধান হ'ল:

window.addEventListener('scroll',() => {
    var x = window.scrollX;
    var y = window.scrollY;
    window.scrollTo(x,y);
});

এবং jQuery সহ:

$(window).on('scroll',() => {
    var x = window.scrollX;
    var y = window.scrollY;
    window.scrollTo(x,y)
})

এই ইভেন্ট শ্রোতাদের স্ক্রোলিং ব্লক করা উচিত। পুনরায় স্ক্রোলিং সক্ষম করতে তাদের সরান

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.