রিফ্রেশে স্বয়ংক্রিয় ব্রাউজার স্ক্রোল প্রতিরোধ করুন

Question

আপনি যদি কোনও পৃষ্ঠায় যান এবং চারদিকে স্ক্রোল করেন তবে পৃষ্ঠাটি রিফ্রেশ করুন যেখানে আপনি এটি রেখে গিয়েছিলেন সে জায়গায় রিফ্রেশ হবে। এটি দুর্দান্ত, তবে এটি url এ অ্যাঙ্কর অবস্থান রয়েছে এমন পৃষ্ঠাগুলিতেও ঘটে। উদাহরণটি হ'ল যদি আপনি কোনও লিঙ্কে ক্লিক করেন http://example.com/post/244#comment5এবং পৃষ্ঠটি সন্ধান করার পরে পৃষ্ঠটি সতেজ করে তোলেন আপনার অ্যাঙ্কারে না থাকে এবং পৃষ্ঠাটি চারপাশে লাফ দেয়। জাভাস্ক্রিপ্ট দিয়ে এটি প্রতিরোধের কোনও উপায় আছে কি? যাতে কোনও ব্যাপার না - আপনি সর্বদা অ্যাঙ্কারে নেভিগেট করবেন।

Comments

একটি jQuery সমাধান ঠিক আছে বা আপনি কি সরল js চান?

— mrtsherman

Answer 1

ব্রাউজারের আচরণের পরিবর্তনের কারণে এই সমাধানটির আর সুপারিশ করা হয় না। অন্যান্য উত্তর দেখুন।

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

$(document).ready(function() {
    if (window.location.hash) { 
        //bind to scroll function
        $(document).scroll( function() {
            var hash = window.location.hash
            var hashName = hash.substring(1, hash.length);
            var element;

            //if element has this id then scroll to it
            if ($(hash).length != 0) {
                element = $(hash);
            }
            //catch cases of links that use anchor name
            else if ($('a[name="' + hashName + '"]').length != 0)
            {
                //just use the first one in case there are multiples
                element = $('a[name="' + hashName + '"]:first');
            }

            //if we have a target then go to it
            if (element != undefined) {
                window.scrollTo(0, element.position().top);
            }
            //unbind the scroll event
            $(document).unbind("scroll");
        });
    }

});

Comments

আমি যে ব্যবহারের কথা ভাবছি তার জন্য অ্যাকাউন্টে থাকা উচিত যদি ব্যবহারকারী স্বয়ংক্রিয় স্ক্রোলিংয়ের আগে পৃষ্ঠাটি স্ক্রোল করে। আমি স্মরণ করি পৃষ্ঠা সম্পূর্ণ লোড হয়ে যাওয়ার পরে কেবল স্বয়ংক্রিয় স্ক্রোলিং হয়। যদি ব্যবহারকারী আগে স্ক্রোল করে তবে অটোস্ক্রোল বাতিল হয়ে যায়। সুতরাং আপনার ব্যবহারকারীর দ্বারা চালিত স্ক্রোল এবং ব্রাউজারের সাথে চালিত ব্রাউজারের মধ্যে পার্থক্য করার কিছু উপায় দরকার। আমি এটি কীভাবে করব তা জানি না, তবে আমার মনে আছে এটি সম্ভব।

— mrtsherman

বুয়াঃ! গভীর রাতে সমস্যাটি ছিল মজাদার। আমি আমার বসকে বলছি যদিও আমি আমার ডেস্কে ঘুমিয়ে পড়ি তবে এটি আপনার দোষ। আমি কেবল রিটার্নের বিবৃতি সরিয়ে নিতে দ্রুত পরিবর্তন করেছি। এটি আনবাইন্ডিংয়ের সাথে হস্তক্ষেপ করে আমি স্ক্রোল ইভেন্টের জন্য যুক্ত করেছি।

— মিস্টারশারম্যান

প্রাথমিকভাবে আমি এটি পরীক্ষা করার জন্য একটি ছোট বেসিক উদাহরণ ফাইলের মধ্যে এই কাজটি পেয়েছি। একবার আমি নিশ্চিত করেছিলাম যে এটি কাজ করে আমি কীভাবে আমার প্রকল্পের মধ্যে এটি কাজ করে না তা নিয়ে আমি হতবাক হয়ে পড়েছিলাম। প্রক্রিয়া-নির্মূলকরণের মাধ্যমে আমি আমার সিএসএস ফাইলে একটি একক শৈলীর ঘোষণার সন্ধান করতে সক্ষম হয়েছি যা এটির জন্য দোষ সৃষ্টি করেছিল। এটি ছিল একটি বহিরাগত ফন্টের প্রয়োগ। আমি আপনার কোডটি একটি ফাংশনে আবৃত করেছি এবং এখন এটিকে ডক.ডিয়ার হ্যান্ডলারের মধ্যে একটি window (উইন্ডো) .লোড () হ্যান্ডলারের মধ্যে দিয়ে যাচ্ছি। এটি এখন (সামান্য প্রাথমিক পৃষ্ঠা ফ্লিকারের সাথে) কাজ করার জন্য seams করে। কোডের জন্য ধন্যবাদ! এটি যদি একটি দৃ fix় স্থির হয় তবে আমাকে জানান।

— টমাসরেগি

পৃষ্ঠাগুলির পরে লোড হওয়ার পরে এমন সামগ্রী থাকলে এটি কাজ করবে না; উদাহরণস্বরূপ: ২ টি ডিভ রয়েছে যা ব্যানার দিয়ে আজাক্স থেকে পূর্ণ হবে।

— Decebal

@ ফ্ল্যাশথান্ডার - আপনি কি "কাজ করে না" সংজ্ঞা দিতে পারেন? একটি কনসোল বার্তা পোস্ট করবেন?

— শ্রীশেরমান

Answer 2

ক্রোমে, আপনি স্ক্রোলটপ 0 তে জোর করেও প্রথম স্ক্রোল ইভেন্টের পরে এটি পরে চলে যাবে।

আপনার এতে স্ক্রোলটি আবদ্ধ করা উচিত:

$(window).on('beforeunload', function() {
    $(window).scrollTop(0);
});

সুতরাং ব্রাউজারটি বিশ্বাস করে প্রতারণা করা হয় যে এটি রিফ্রেশের আগে শুরুতে ছিল।

Comments

আপনি যদি স্ক্রলিংয়ের সাথে গোলযোগ না করতে চান তবে গৃহীত উত্তরের চেয়ে আরও কার্যকর উপায়।

— ড্যান আব্রামভ

এটি ক্রোম 33 এ কাজ করছে না I আমার অর্থ নতুন পৃষ্ঠাটি লোড করার আগে এটি শীর্ষে স্ক্রোল করে। তবে ব্রাউজারটি এখনও আগের স্ক্রোল অবস্থানটি কোনওভাবে মনে রাখে এবং সেই অবস্থানটিতে একই অটস্ক্রোল সম্পাদন করে।

— হারালান ডবরেভ

ক্রোম 36, ফায়ারফক্স 30 এবং আইই 11 পরীক্ষা করা হয়েছে খুব ভাল কাজ করে!

— ফিজিক্স

নন- window.onbeforeunload = function(){ window.scrollTo(0,0); }

— জিকুয়েরি

আপনি কেন 'আনলোড' না করে 'পূর্বেইলোড' ইভেন্টটি বেছে নিয়েছিলেন? আমার পরীক্ষাগুলি দেখায় যে শেষেরটি ব্রাউজারের মাধ্যমে পৃষ্ঠাটি সত্যিই লোড হওয়ার আগে শীর্ষে উঠে আসা এড়াতে অনুমতি দেয়।

— আলেকসান্ডার জোনভ

Answer 3

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

<script>history.scrollRestoration = "manual"</script>

এটি IE দ্বারা সমর্থিত নয়। ব্রাউজার সামঞ্জস্য।

Comments

আইই / এজ এ যদি এটি উপলব্ধ থাকে তবে এটি সেরা উত্তর হবে। : এটা যদিও এখানে বাস্তবায়িত হওয়ার জন্য আপনি ভোট দিতে পারবেন wpdev.uservoice.com/forums/257854-microsoft-edge-developer/...

— দ্য চর্ব্য

এটি 2019 সালে সত্যই সঠিক উত্তর হওয়া উচিত other অন্য কোনও পদ্ধতিতে 100% কাজ করে না।

— লম্বো

নিশ্চিত করতে পারেন এটি সেরা সমাধান। এখানে অন্যান্য সমাধানগুলি মোবাইল সাফারিটিতে কাজ করে না এবং জঙ্কি হতে পারে। এটি পুরোপুরি কাজ করে।

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

Answer 4

অনেক ব্যর্থতার পরে অবশেষে আমি কৌশলটি পরিচালনা করতে পেরেছি। আনজো এখানে সঠিক কারণ ব্যবহারকারীর দ্বারা beforeunloadপৃষ্ঠাটি লাফিয়ে উঠবে যখন কোনও ব্যবহারকারী পৃষ্ঠা পুনরায় লোড করবে বা কোনও লিঙ্ক ক্লিক করবে। তাই unloadপরিষ্কারভাবে এই কাজ করতে উপায়।

$(window).on('unload', function() {
   $(window).scrollTop(0);
});

জাভাস্ক্রিপ্ট উপায় (ধন্যবাদ প্রোফনন্দ ):

window.onunload = function(){ window.scrollTo(0,0); }

সম্পাদনা: 16/07/2015

জাম্প ইস্যুটি এখনও unloadইভেন্ট সহ ফায়ারফক্সে রয়েছে ।

Comments

সমাধানের চেয়ে এই সমাধানটি আরও ভাল beforeunloadকারণ এটি পুনরায় লোড এবং অ্যাঙ্কর ক্লিকগুলিতে পৃষ্ঠার শীর্ষে জাম্পিং প্রতিরোধ করে।

— ব্র্যাডগ্রিনস

@ ব্র্যাডগ্রিনস আধুনিক ক্রোমের সাহায্যে অননলোড ইভেন্টটি ট্রিগার করা হয় যখন ব্যবহারকারীরা অন্য ট্যাবগুলিতে স্যুইচ করেন যা অপ্রত্যাশিত। onfeforeunload এখনও বৈধ workaround।

— টেলভিন এনগুইন

@ টেলভিনএনগুইন আপনি কি এই বিষয়ে কোনও সংস্থান দিতে পারেন? আমি এটি গুগল ক্রোম tested২ এ পরীক্ষা করেছি এবং এখনও আমার জন্য ভাল কাজ করে।

— জনাকা ডোম্বাওয়েলা 12'19

@ জনাকাডম্বাওয়েলা আমি যা বলেছি: নতুন ট্যাব স্থানান্তর করা যা সমস্যার কারণ হবে তা ভুল। যাইহোক, আপনি দেখতে পারেন এই উদাহরণে ইভেন্টটি ইউনলোডটি সঠিকভাবে ট্রিগার হয় না, এমনকি jQuery 1.9.1 বনাম jQuery 1.8.3 দিয়েও। অননলোড অবিশ্বাস্য। jsfiddle.net/6s4jhdug/3 (1.8.3) jsfiddle.net/frt45ue9 (1.9.1)

— টেলভিন নগুইন

Answer 5

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

function storePagePosition() {
  var page_y = window.pageYOffset;
  localStorage.setItem("page_y", page_y);
}


window.addEventListener("scroll", storePagePosition);


var currentPageY;

try {
  currentPageY = localStorage.getItem("page_y");

  if (currentPageY === undefined) {
    localStorage.setItem("page_y") = 0;
  }

  window.scrollTo( 0, currentPageY );
} catch (e) {
    // no localStorage available
}

Answer 6

আপনি কেবল শেষে একটি # টি রাখতে পারেন যাতে পৃষ্ঠার শীর্ষে লোড হবে।

সমস্ত ব্রাউজারে, মোবাইল এবং ডেস্কটপে কাজ করে, কারণ এটি এত সহজ।

$(document).ready(function() {
var url = window.location.href;
console.log(url);
if( url.indexOf('#') < 0 ) {
    window.location.replace(url + "#");
} else {
    window.location.replace(url);
}

});

// এটি পৃষ্ঠাটি শেষে # দিয়ে লোড করে।

Comments

আমি যদি সরাসরি আমার সার্ভারে এটি চেষ্টা করি তবে এটি যাদুবিদ্যার মতো কাজ করে। তবে, আমার সেন্টিমিটি আমাকে মার্ক-আপ ত্রুটি দিচ্ছে। আমি কি তা বুঝতে পারি না।

— এলিস

আপনি যদি

— jpery এর

Answer 7

এটি আমার পক্ষে কাজ করে।

    //Reset scroll top

    history.scrollRestoration = "manual"

    $(window).on('beforeunload', function(){
          $(window).scrollTop(0);
    });

Answer 8

তোমার পারা উচিত।

অনলোড, window.location.hashকোনও মান আছে কিনা তা পরীক্ষা করে দেখুন । যদি এটি হয়, হ্যাশ মানের সাথে মেলে এমন একটি আইডি দিয়ে উপাদানটি ধরুন। উপাদানটির অবস্থানটি সন্ধান করুন (অফসেটটপ / অফসেটলফেতে পুনরাবৃত্ত কলগুলি) এবং তারপরে সেই মানগুলিকে window.scrollTo(x, y)পদ্ধতিতে পাস করুন ।

এটি পৃষ্ঠাটি পছন্দসই উপাদানটিতে স্ক্রোল করা উচিত।

Comments

এটি ব্রাউজারগুলিকে একটি অটো স্ক্রোল করতে বাধা দিচ্ছে না। এই প্রশ্নটি এটাই।

— হরালান ডবরেভ