অ্যান্ড্রয়েডের ক্রোম টান-ডাউন-রিফ্রেশ বৈশিষ্ট্যটি অক্ষম করা হচ্ছে

Question

আমি আমার সংস্থার জন্য একটি ছোট HTML5 ওয়েব অ্যাপ্লিকেশন তৈরি করেছি।

এই অ্যাপ্লিকেশনটি আইটেমগুলির একটি তালিকা প্রদর্শন করে এবং সবকিছু ঠিকঠাক করে।

অ্যাপ্লিকেশনটি মূলত ব্রাউজার হিসাবে অ্যান্ড্রয়েড ফোন এবং ক্রোমে ব্যবহৃত হয়। এছাড়াও, হোমটি স্ক্রিনে সাইটটি সংরক্ষিত হয়েছে যাতে অ্যান্ড্রয়েড পুরো জিনিসটিকে অ্যাপ হিসাবে পরিচালনা করে ( আমার ধারণা যে কোনও ওয়েবউউ ব্যবহার করে) )।

ক্রোম বিটা (এবং আমিও মনে করি অ্যান্ড্রয়েড সিস্টেম ওয়েবভিউ) "রিফ্রেশ করতে টান ডাউন" বৈশিষ্ট্যটি চালু করেছে ( উদাহরণস্বরূপ এই লিঙ্কটি দেখুন )।

এটি একটি সুবিধাজনক বৈশিষ্ট্য তবে আমি ভাবছিলাম যে এটি কোনও মেটা ট্যাগ (বা জাভাস্ক্রিপ্ট স্টাফ) দিয়ে অক্ষম করা যেতে পারে কারণ তালিকার নেভিগেট করার সময় ব্যবহারকারীর দ্বারা রিফ্রেশটি সহজেই ট্রিগার করা যায় এবং পুরো অ্যাপটি পুনরায় লোড করা হয় is

এছাড়াও এটি এমন একটি বৈশিষ্ট্য যা অ্যাপ্লিকেশনটির প্রয়োজন হয় না।

আমি জানি যে এই বৈশিষ্ট্যটি এখনও কেবলমাত্র ক্রোম বিটাতে উপলভ্য, তবে আমার মধ্যেও সংবেদন রয়েছে যে এটি স্থিতিশীল অ্যাপেও অবতরণ করছে।

ধন্যবাদ!

সম্পাদনা: আমি Chrome বিটা আনইনস্টল করেছি এবং হোম স্ক্রিনে পিন করা লিঙ্কটি এখন স্থিতিশীল ক্রোম দিয়ে খোলে। সুতরাং পিনযুক্ত লিঙ্কগুলি ওয়েব দর্শন দিয়ে নয় ক্রোম দিয়ে শুরু হয়।

সম্পাদনা করুন: আজ (2015-03-19) পুল-ডাউন-রিফ্রেশ স্থিতিশীল ক্রোমে এসেছে।

সম্পাদনা: @ এভিনের উত্তর থেকে আমি এই লিঙ্কটি অনুসরণ করি এবং এই জাভাস্ক্রিপ্ট / জাকোয়ারি কোডটি কার্যকর হয়।

var lastTouchY = 0;
var preventPullToRefresh = false;

$('body').on('touchstart', function (e) {
    if (e.originalEvent.touches.length != 1) { return; }
    lastTouchY = e.originalEvent.touches[0].clientY;
    preventPullToRefresh = window.pageYOffset == 0;
});

$('body').on('touchmove', function (e) {
    var touchY = e.originalEvent.touches[0].clientY;
    var touchYDelta = touchY - lastTouchY;
    lastTouchY = touchY;
    if (preventPullToRefresh) {
        // To suppress pull-to-refresh it is sufficient to preventDefault the first overscrolling touchmove.
        preventPullToRefresh = false;
        if (touchYDelta > 0) {
            e.preventDefault();
            return;
        }
    }
});

@ বিসিএনটিগ্রিটি হিসাবে উল্লেখ করা হয়েছে, আমি ভবিষ্যতে কোনও সাইটের ম্যানিফেস্ট সলিউশন (এবং / অথবা একটি মেটা-ট্যাগ) আশা করি।

উপরের কোডটির জন্য পরামর্শগুলি স্বাগত।

Comments

হ্যাঁ এই সত্যিই সফলকাম। ফর্মের মাঝামাঝি ছিল এবং খুব দূরে শীর্ষে স্ক্রোল করা হয়েছিল এবং এটি রিফ্রেশ এবং সবকিছু হারিয়েছে। এটি একটি retarded ডিফল্ট বৈশিষ্ট্য, আমি রিফ্রেশ করতে চাইলে আমি রিফ্রেশ আইকন ক্লিক করুন!

— ব্রক হেনসলে

আমার ওয়েব অ্যাপ্লিকেশন ম্যানিফেস্টে এই বৈশিষ্ট্যটি অক্ষম করা যেতে পারে তবে দুর্দান্ত হবে। দুর্ভাগ্যক্রমে, আমার ওয়েব অ্যাপ্লিকেশনটির প্রতিটি পৃষ্ঠায় স্ক্রোলযোগ্য সামগ্রী রয়েছে, রিফ্রেশ না করে নেভিগেট করা প্রায় অসম্ভব হয়ে পড়ে। আমি একটু টিক পেয়েছি। : /

— সেকেন্ডারিটি

এটি ভাল তথ্য। আমি এমন ওয়েবসাইটগুলিকে ঘৃণা করি যা ফিচারটি রিফ্রেশ করার জন্য টান অক্ষম করে। পৃষ্ঠাগুলি নির্বিশেষে রিফ্রেশ কাজ করতে আমি একটি বৈশিষ্ট্য বিকাশ করতে চাই।

— এলএস

ওয়েব বিকাশকারী হিসাবে কথা বলায়, পুলডাউন রিফ্রেশ ডেটা-চালিত ওয়েবসাইটগুলির সাথে বেমানান, কারণ এটি অ্যাপ্লিকেশনটি পুনরায় লোড করে। এটি ব্যবহারকারীর পক্ষে পুরো পৃষ্ঠাকে রিফ্রেশ না করে কোনও পৃষ্ঠার শীর্ষে স্ক্রোল করা অসম্ভব করে তোলে। আমি ক্রোমের 100% সমর্থক, আশা করি তারা এই বিরোধী বৈশিষ্ট্যটি সরিয়ে ফেলবে।

— মটরশুটি

আমি নিজেকে এই জিসি "বৈশিষ্ট্য" এর সাথে মুখোমুখি করেছি ... প্রচুর ওয়েব পৃষ্ঠাগুলি, অনেকগুলি ফর্ম, একটি অনাদায়ী আমার আঙুল দিয়ে টানুন এবং এই পৃষ্ঠায় ডেটা হারিয়ে গেছে! আইএমও প্রতিরোধ করুন এটি ডিফল্টরূপে বন্ধ করা উচিত, যার এটির দরকার পরে কোডটি দেওয়া হোক। আমি কয়েকদিন ধরেই অবাক হয়েছি কেন আমার "ক্লায়েন্টরা" মাঝে মাঝে

— লুডাস এইচ

Answer 1

টানা-রিফ্রেশ প্রভাবের ডিফল্ট ক্রিয়াকলাপটি নিম্নলিখিত যে কোনও একটি দ্বারা কার্যকরভাবে প্রতিরোধ করা যেতে পারে:

1. preventDefault'নীচের যে কোনও একটি সহ স্পর্শ ক্রমের কিছু অংশ যুক্ত করা (সর্বাধিক বিঘ্নজনক থেকে অন্তত বিঘ্নিত করার উদ্দেশ্যে):
   • ক। পুরো টাচ স্ট্রিম (আদর্শ নয়)।
   • খ। সমস্ত শীর্ষ ওভারসক্রোলিং টাচমোভস।
   • গ। প্রথম শীর্ষ ওভারক্রোলিং টাচমোভ।
   • ঘ। প্রথম শীর্ষ ওভারসক্রোলিং টাচমোভ কেবল তখনই 1) পৃষ্ঠার স্ক্রোল অফসেটটি শূন্য এবং 2) প্রাথমিক টাচস্টার্টটি ঘটেছিল তখন টাচমোভ শীর্ষ ওভারসক্রোলকে প্ররোচিত করবে।
2. touch-action: noneস্পর্শ-লক্ষ্যযুক্ত উপাদানগুলিতে " " প্রয়োগ করা , যেখানে উপযুক্ত, স্পর্শের ক্রমটির ডিফল্ট ক্রিয়াগুলি (পুল-টু-রিফ্রেশ সহ) অক্ষম করুন।
3. overflow-y: hiddenপ্রয়োজনে স্ক্রোলযোগ্য সামগ্রীর জন্য একটি ডিভি ব্যবহার করে শরীরের উপাদানগুলিতে " " প্রয়োগ করা ।
4. এর মাধ্যমে স্থানীয়ভাবে এফেক্টটি অক্ষম করা হচ্ছে chrome://flags/#disable-pull-to-refresh-effect)।

আরো দেখুন

Comments

আপনাকে ধন্যবাদ অ্যাভিন। আমি বিশ্বাস করতে পারি না এটি একটি দ্রুত সমাধান ছিল! আমি শরীরের উপাদানগুলির জন্য ওভারফ্লো-ওয়াইয়ের জন্য সিএসএস স্থাপন করেছি: লুকানো।

— আন্তঃসংযোগতা

ধন্যবাদ @ এভিন, আমি প্রতিরোধক ডিফল্ট () প্রথম পদ্ধতিটি ব্যবহার করার সিদ্ধান্ত নিয়েছি। বিশেষত আমি লিঙ্কটির উত্স কোডটি আকর্ষণীয় পেয়েছি ( লিঙ্ক ) যা আপনার লিঙ্ক করা নথির অভ্যন্তরে রয়েছে। আমি আমার প্রশ্নের শেষে কোডটি রাখব।

— সেবাস্তিয়ানো

প্রোগ্রামক্রমে "ক্রোম: // ফ্ল্যাগস (ডিস্ক-টু-টু-রিফ্রেশ-এফেক্ট)" কীভাবে করা হয়?

— কেউ

@ সুমোনসোমাম যেখানেই আমি জানি, এটি অসম্ভব নয়। ক্রোম সেটিংস কেবলমাত্র ব্যবহারকারী সেট করতে পারেন - এটি অন্যথায় সুরক্ষা ঝুঁকি তৈরি করে

— মাইক

শরীরের উপাদানগুলিতে "ওভারফ্লো-ওয়াই: লুকানো" প্রয়োগ করা, স্ক্রোলযোগ্য সামগ্রীর জন্য একটি ডিভ ব্যবহার করে আমার পক্ষে কাজ করে।

— রবিন

Answer 2

2019+ এর সহজ সমাধান

এটির জন্য সহায়তা করতে Chrome 63 একটি CSS সম্পত্তি যুক্ত করেছে। আপনি কীভাবে এটি পরিচালনা করতে পারেন তার একটি ভাল ধারণা পেতে গুগলের এই গাইডটির মাধ্যমে পড়ুন ।

এখানে তাদের টিএল: ডিআর

CSS ওভারসক্রোল-আচরণ বৈশিষ্ট্য বিকাশকারীদের সামগ্রীর উপরে / নীচে পৌঁছানোর সময় ব্রাউজারের ডিফল্ট ওভারফ্লো স্ক্রোল আচরণকে ওভাররাইড করতে দেয়। ব্যবহারের ক্ষেত্রে মোবাইলের মধ্যে টান-রিফ্রেশ বৈশিষ্ট্যটি নিষ্ক্রিয় করা, ওভারসক্রোল আভা এবং রাবারব্যান্ডিং প্রভাবগুলি অপসারণ এবং কোনও পৃষ্ঠা / সামগ্রীর নীচে থাকা পৃষ্ঠার সামগ্রীকে স্ক্রোলিং থেকে রোধ করা অন্তর্ভুক্ত Use

এটি কাজ করতে, আপনাকে যা যুক্ত করতে হবে তা হ'ল এটি আপনার সিএসএসে:

body {
  overscroll-behavior: contain;
}

এটি এখনকার জন্য কেবল ক্রোম, এজ এবং ফায়ারফক্স দ্বারা সমর্থিত তবে আমি নিশ্চিত যে তারা পরিষেবা কর্মীদের এবং পিডাব্লুএর ভবিষ্যতের সাথে পুরোপুরি জাহাজে উঠবে বলে মনে হচ্ছে সাফারি এটিকে যুক্ত করবে।

Comments

এটি সর্বশেষতম আনসারটি রয়েছে

— কলসি 21

"হোমস্ক্রিনে যোগ করুন" ক্রোম ব্যানারটির উপস্থিতিতে এই বিলম্বের কারণ অন্য কেউ লক্ষ্য করেছেন?

— নাথানিয়েল হিল

এটি নিষ্ক্রিয় করার জন্য এটি এইচটিএমএল উপাদানটিতে প্রয়োগ করতে হয়েছিল

— জাকব এরিকসন

এটি কেবল অ্যান্ড্রয়েডের জন্য, আইও-এর ক্রোম এখনও গ্লোজ এফেক্ট দেখায় + রিফ্রেশ করতে নেটিভ টান দেয়

— Fky

বিকাশকারীদের

— ডটকম

Answer 3

এই মুহুর্তে আপনি কেবল ক্রোম: // ফ্ল্যাগ / # অক্ষম-টান-টু-রিফ্রেশ-ইফেক্টের মাধ্যমে এই বৈশিষ্ট্যটি অক্ষম করতে পারবেন - আপনার ডিভাইস থেকে সরাসরি খুলুন।

আপনি touchmoveইভেন্টগুলি ধরার চেষ্টা করতে পারেন , তবে একটি গ্রহণযোগ্য ফলাফল পাওয়ার জন্য সম্ভাবনাগুলি খুব পাতলা।

Comments

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

— সেবাস্তিয়ানো

দুঃখের বিষয় এটি সর্বোত্তম সমাধান বলে মনে হচ্ছে - ভবিষ্যতে যদি এই পতাকাটির সেটিং পরিবর্তন হয় বা আপনি অন্য সাইটগুলিতে রিফ্রেশ করার জন্য টান ব্যবহার করতে সক্ষম হতে চান ... অবাক হয়ে যান যে এটি প্রোগ্রামিকভাবে নিয়ন্ত্রণ করা যায় না। :(।

— ব্যবহারকারী 1063287

গুগলের সিইও যদি এটি পড়তে থাকে তবে দয়া করে এই বৈশিষ্ট্যটি সরিয়ে দিন। এটি সহজে এবং ব্যাপকভাবে অক্ষম করা যেতে পারে বলে মনে হয় না এবং আমার মতে একটি ওয়েব অ্যাপ্লিকেশন "বৈশিষ্ট্য" যা সমস্ত ওয়েব অ্যাপ্লিকেশন চায় না।

— ব্যবহারকারী 1063287

Answer 4

আমি MooTools ব্যবহার করি, এবং আমি একটি লক্ষ্যযুক্ত উপাদানের রিফ্রেশ অক্ষম করতে একটি ক্লাস তৈরি করেছি, তবে এর ক্রুজটি (নেটিভ জেএস):

var target = window; // this can be any scrollable element
var last_y = 0;
target.addEventListener('touchmove', function(e){
    var scrolly = target.pageYOffset || target.scrollTop || 0;
    var direction = e.changedTouches[0].pageY > last_y ? 1 : -1;
    if(direction>0 && scrolly===0){
        e.preventDefault();
    }
    last_y = e.changedTouches[0].pageY;
});

আমরা এখানে যা কিছু করি তা হ'ল টাচমোভের Y দিক খুঁজে পাওয়া যায় এবং আমরা যদি স্ক্রিনের নিচে চলে যাচ্ছি এবং লক্ষ্য স্ক্রোল 0 হয়, আমরা ইভেন্টটি থামিয়ে দেব। সুতরাং, কোন রিফ্রেশ।

এর অর্থ আমরা প্রতিটি 'পদক্ষেপে' গুলি চালাচ্ছি যা ব্যয়বহুল হতে পারে তবে আমি এখনও অবধি খুঁজে পাওয়া সেরা সমাধান ...

Comments

ব্যবহারকারীর স্ক্রল ডাউন হওয়ার সাথে সাথে দেখা বন্ধ করা নিরাপদ, কারণ রিফ্রেশ করার টানটি ট্রিগার হওয়ার কোনও সম্ভাবনা নেই। তেমনি, যদি scrolltop > 0, ইভেন্টটি ট্রিগার করা হবে না। আমার বাস্তবায়নে, আমি touchmoveইভেন্টটি touchstartকেবল তখনই আবদ্ধ করি scrollTop <= 0। ব্যবহারকারীর স্ক্রোল ডাউন হওয়ার সাথে সাথেই আমি এটি আবদ্ধ করি ( initialY >= e.touches[0].clientY)। যদি ব্যবহারকারী স্ক্রল করে ( previousY < e.touches[0].clientY), তবে আমি কল করি preventDefault।

— নিকোলাস বাউলিয়ান

Answer 5

বহু ঘন্টা চেষ্টা করার পরেও এই সমাধানটি আমার পক্ষে কাজ করে

$("html").css({
    "touch-action": "pan-down"
});

Comments

এর জন্য jQuery ব্যবহার করার দরকার নেই। আপনার সিএসএস কোড ফাইলে কেবল "টাচ-অ্যাকশন: প্যান-ডাউন" যুক্ত করুন।

— কেগান তিতের্ট

এটি কেবল আপনার html{touch-action:pan-down}

— সিএসএসে

Answer 6

AngularJS

আমি এই কৌনিক জেএস নির্দেশের সাথে এটি সফলভাবে অক্ষম করেছি:

//Prevents "pull to reload" behaviour in Chrome. Assign to child scrollable elements.
angular.module('hereApp.directive').directive('noPullToReload', function() {
    'use strict';

    return {
        link: function(scope, element) {
            var initialY = null,
                previousY = null,
                bindScrollEvent = function(e){
                    previousY = initialY = e.touches[0].clientY;

                    // Pull to reload won't be activated if the element is not initially at scrollTop === 0
                    if(element[0].scrollTop <= 0){
                        element.on("touchmove", blockScroll);
                    }
                },
                blockScroll = function(e){
                    if(previousY && previousY < e.touches[0].clientY){ //Scrolling up
                        e.preventDefault();
                    }
                    else if(initialY >= e.touches[0].clientY){ //Scrolling down
                        //As soon as you scroll down, there is no risk of pulling to reload
                        element.off("touchmove", blockScroll);
                    }
                    previousY = e.touches[0].clientY;
                },
                unbindScrollEvent = function(e){
                    element.off("touchmove", blockScroll);
                };
            element.on("touchstart", bindScrollEvent);
            element.on("touchend", unbindScrollEvent);
        }
    };
});

ব্যবহারকারীর স্ক্রল ডাউন হওয়ার সাথে সাথে দেখা বন্ধ করা নিরাপদ, কারণ রিফ্রেশ করার টানটি ট্রিগার হওয়ার কোনও সম্ভাবনা নেই।

তেমনি, যদি scrolltop > 0, ইভেন্টটি ট্রিগার করা হবে না। আমার বাস্তবায়নে, টাচমুভ ইভেন্টটিকে আমি টাচস্টার্টটিতে আবদ্ধ করি, যদি কেবলমাত্র scrollTop <= 0। ব্যবহারকারীর স্ক্রোল ডাউন হওয়ার সাথে সাথেই আমি এটি আবদ্ধ করি ( initialY >= e.touches[0].clientY)। যদি ব্যবহারকারী স্ক্রল করে ( previousY < e.touches[0].clientY), তবে আমি কল করি preventDefault()।

এটি আমাদের অযথা স্ক্রোল ইভেন্টগুলি দেখা থেকে বাঁচায়, তবুও ওভারস্রোলিংকে অবরুদ্ধ করে।

jQuery এর

আপনি যদি jQuery ব্যবহার করেন তবে এটি অনির্ধারিত সমতুল্য। elementএকটি jQuery উপাদান:

var initialY = null,
    previousY = null,
    bindScrollEvent = function(e){
        previousY = initialY = e.touches[0].clientY;

        // Pull to reload won't be activated if the element is not initially at scrollTop === 0
        if(element[0].scrollTop <= 0){
            element.on("touchmove", blockScroll);
        }
    },
    blockScroll = function(e){
        if(previousY && previousY < e.touches[0].clientY){ //Scrolling up
            e.preventDefault();
        }
        else if(initialY >= e.touches[0].clientY){ //Scrolling down
            //As soon as you scroll down, there is no risk of pulling to reload
            element.off("touchmove");
        }
        previousY = e.touches[0].clientY;
    },
    unbindScrollEvent = function(e){
        element.off("touchmove");
    };
element.on("touchstart", bindScrollEvent);
element.on("touchend", unbindScrollEvent);

স্বাভাবিকভাবেই, খাঁটি জেএস দিয়েও এটি অর্জন করা যায়।

Comments

e.originalEvent.touches[0].clientYএই কাজটি করতে আমাকে ব্যবহার করতে হয়েছিল। এখনও যুক্তিবিজ্ঞান সঙ্গে সংগ্রাম যখন রিলোড প্রতিরোধ। এখনই মনে হচ্ছে এলোমেলোভাবে স্ক্রোলিং রোধ করা ... সঠিক ইঙ্গিতটির জন্য ধন্যবাদ রাখুন!

— থোমাস

নির্দেশকে কোন উপাদানটিতে যুক্ত করা হয়েছে?

— ফিজিক্স

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

— ডাস্টিন জেনসেন

Answer 7

সরল জাভাস্ক্রিপ্ট

আমি স্ট্যান্ডার্ড জাভাস্ক্রিপ্ট ব্যবহার করে প্রয়োগ করেছি। সহজ এবং কার্যকর করা সহজ। শুধু পেস্ট করুন এবং এটি সূক্ষ্ম কাজ করে।

<script type="text/javascript">         //<![CDATA[
     window.addEventListener('load', function() {
          var maybePreventPullToRefresh = false;
          var lastTouchY = 0;
          var touchstartHandler = function(e) {
            if (e.touches.length != 1) return;
            lastTouchY = e.touches[0].clientY;
            // Pull-to-refresh will only trigger if the scroll begins when the
            // document's Y offset is zero.
            maybePreventPullToRefresh =
                window.pageYOffset == 0;
          }

          var touchmoveHandler = function(e) {
            var touchY = e.touches[0].clientY;
            var touchYDelta = touchY - lastTouchY;
            lastTouchY = touchY;

            if (maybePreventPullToRefresh) {
              // To suppress pull-to-refresh it is sufficient to preventDefault the
              // first overscrolling touchmove.
              maybePreventPullToRefresh = false;
              if (touchYDelta > 0) {
                e.preventDefault();
                return;
              }
            }
          }

          document.addEventListener('touchstart', touchstartHandler, false);
          document.addEventListener('touchmove', touchmoveHandler, false);      });
            //]]>    </script>

Comments

এটি ক্রোমের পক্ষে খুব ভালভাবে কাজ করেছে, তবে পৃষ্ঠার শীর্ষে একটি ডিভোল স্ক্রোল করার সময় সাফারি / আইওএস 9.2-এ আমার জন্য স্ক্রোল করা নিয়ে কিছু সমস্যা সৃষ্টি হয়েছিল ( এখানে পুনঃপ্রবর্তিত )। আমি উপরের এভিনেরbody: {overflow-y:hidden} কৌশলটি ব্যবহার করে শেষ করেছি ।

— সিনেটটি

ডাউনভোটিং যেমন ক্রোমে কাজ করে না, তবে ফায়ারফক্স উদাহরণে কাজ করে, এম্বেড.প্লানক্র.কম / rqbOVSOkKyhAgoHK2sEP কেবল মোবাইলেই খোলা

— বিজয়

আপনি যে লিঙ্কটি আটকিয়েছেন তা আমার অ্যান্ড্রয়েড মোবাইলে ক্রোমেও কাজ করেছে। এটি টানতে রিফ্রেশ করতে দেয়নি। আপনি Android এর জন্য কোন সংস্করণ / আইওএস ব্যবহার করছেন?

— সাকি সান

ক্রোম 56 থেকে আপনাকে প্যাসিভ সেট করতে হবে: এটির কাজটি করতে মিথ্যা: ডকুমেন্ট.এডএডএভেন্টলিস্টনার ('টাচস্টার্ট', টাচস্টার্টহ্যান্ডলার, {প্যাসিভ: ভুয়া}); document.addEventListener ('টাচমোভ', টাচমোভ হ্যান্ডলার, {প্যাসিভ: ভুয়া});

— আন্তন কুজমিন

Answer 8

খাঁটি সিএসএসের সেরা সমাধান:

body {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: -1px;
    z-index: 1;
    margin: 0;
    padding: 0;
    overflow-y: hidden;
}
#pseudobody {
    width:100%;
    height: 100%;
    position: absolute;
    top:0;
    z-index: 2;
    margin: 0;
    padding:0;
    overflow-y: auto;
}

এই ডেমোটি দেখুন: https://jsbin.com/pokusideha/quiet

Comments

আপনি কি ক্রোম ব্যবহার করে কোনও মোবাইলে সত্যিই এটি পরীক্ষা করেছেন?

— গ্রেগর ভৌনভ

Answer 9

আপনি এটি চেষ্টা করতে পারেন

body {
  /* Disables pull-to-refresh but allows overscroll glow effects. */
  overscroll-behavior-y: contain;
}

উদাহরণ:

https://ebidel.github.io/demos/chatbox.html

সম্পূর্ণ ডক https://developers.google.com/web/updates/2017/11/overscrol-behaviour

Answer 10

আমি আপনার শরীরের সিএসএস ওভারফ্লো-ওয়াই সেট করতে দেখতে পেয়েছি : লুকানো সহজতম উপায়। আপনি যদি কোনও স্ক্রোলিং অ্যাপ্লিকেশন পৃষ্ঠা পেতে চান না তবে আপনি কেবল স্ক্রোলিং বৈশিষ্ট্য সহ একটি ডিভ ধারক ব্যবহার করতে পারেন।

Comments

এটি একটি লাইন দিয়ে ঠিক করা অসম্ভব বলে মনে হচ্ছে তবে একটি কবজির মতো কাজ করে, অনেক অনেক ধন্যবাদ!

— ইগনাচিও আরা

Answer 11

নোট করুন যে ওভারফ্লো-ওয়াই উত্তরাধিকার সূত্রে প্রাপ্ত নয়, সুতরাং আপনার এটিকে সমস্ত ব্লক উপাদানগুলিতে সেট করা দরকার।

আপনি jQuery এর মাধ্যমে সহজভাবে এটি করতে পারেন:

        $(document.body).css('overflow-y', 'hidden'); 
        $('*').filter(function(index) {
            return $(this).css('display') == 'block';
        }).css('overflow-y', 'hidden');

Comments

অন্যান্য উত্তরগুলির মধ্যে, এটি সত্যিই সহায়তা করে। ধন্যবাদ। CSS এ এই লাইন যুক্ত করুন। শরীর {ওভারফ্লো-ওয়াই: লুকানো; }

— সারিন জেএস

Answer 12

কয়েক সপ্তাহ পরে আমি জানতে পেরেছি যে আমি যে জাভাস্ক্রিপ্ট ফাংশনটি ক্রোম রিফ্রেশ অ্যাকশনটি অক্ষম করেছিলাম সেটি আর কাজ করবে না। এটি সমাধানের জন্য আমি এটি তৈরি করেছি:

$(window).scroll(function() {
   if ($(document).scrollTop() >= 1) {
      $("html").css({
         "touch-action": "auto"}
      );
   } else {
      $("html").css({
         "touch-action": "pan-down"
      });
   }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

Answer 13

খাঁটি জেএস দ্রবণ।

// Prevent pull refresh chrome
    var lastTouchY = 0;
    var preventPullToRefresh = false;
    window.document.body.addEventListener("touchstart", function(e){
        if (e.touches.length != 1) { return; }
        lastTouchY = e.touches[0].clientY;
        preventPullToRefresh = window.pageYOffset == 0;
    }, false);

    window.document.body.addEventListener("touchmove", function(e){

        var touchY = e.touches[0].clientY;
        var touchYDelta = touchY - lastTouchY;
        lastTouchY = touchY;
        if (preventPullToRefresh) {
            // To suppress pull-to-refresh it is sufficient to preventDefault the first overscrolling touchmove.
            preventPullToRefresh = false;
            if (touchYDelta > 0) {
                e.preventDefault();
                return;
            }
        }

    }, false);

Answer 14

আমি যা করেছি তা হ'ল touchstartএবং touchend/ touchcancelইভেন্টগুলিতে নিম্নলিখিতগুলি যুক্ত :

scrollTo(0, 1)

যেহেতু ক্রোম স্ক্রোলওয়াই পজিশনে না থাকলে স্ক্রোল না করে এটি ক্রোমকে 0রিফ্রেশ করতে টানতে বাধা দেবে।

যদি এটি এখনও কাজ না করে, পৃষ্ঠাটি লোড হয়ে গেলে এটি করার চেষ্টাও করুন।

Answer 15

আমি এটি দিয়ে টেনে-ডাউন-রিফ্রেশ সমস্যার সমাধান করেছি:

html, body {
    width: 100%;
    height: 100%;
    overflow: hidden;
}