দেহে স্ক্রোলিং অক্ষম করুন


137

আমি bodyপুরোপুরি এইচটিএমএলে স্ক্রোলিং অক্ষম করতে চাই । আমি নিম্নলিখিত বিকল্পগুলি চেষ্টা করেছি:

  • overflow: hidden; (কাজ করছে না, স্ক্রোলিং অক্ষম করেনি, এটি কেবল স্ক্রোলবারটি আড়াল করে)

  • position: fixed; (এটি কাজ করেছে, তবে এটি পুরোপুরি শীর্ষে স্ক্রোল করেছে, যা এই নির্দিষ্ট অ্যাপ্লিকেশনটির জন্য অগ্রহণযোগ্য)

আমি এই দুটি বিকল্পের কোনও বিকল্প সন্ধান করতে অক্ষম ছিলাম, আরও কি আছে?


3
আপনি কোন উপাদানটির জন্য ওভারফ্লো প্রয়োগ করেছেন: লুকানো?
সাজাদ কারুথেথথ

আপনি এখানে কি অর্জন করার চেষ্টা করছেন? আপনার শেষ লক্ষ্য কি?
jbutler483

2
প্রাসঙ্গিক কোড দেখানো আপনাকে সহায়তা করা সহজ করবে।
স্লিক গীক

1
যথোপযুক্ত সৃষ্টিকর্তাযথোপযুক্ত সৃষ্টিকর্তা; যাবার উপায় যদি এটি কাজ না করে থাকে তবে আপনার সিএসএসে আপনার কিছু অন্য সমস্যা আছে। এইচটিএমএল, বডি {ওভারফ্লো: লুকানো; work যদি এটি কাজ করে না * * {ওভারফ্লো: লুকানো;
Try

উত্তর:


245

সেট করুন heightএবং overflow:

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

http://jsfiddle.net/q99hvawt/


3
"এইচটিএমএল," এর আগে "বডি" সম্পর্কে ভুলে গিয়েছিলেন

2
আইওএসে কাজ করছেন না যখন আপনার কোনও ওভারলে উপাদান থাকে যা স্থির অবস্থান করে।
notQ

1
আপনি কেবল "ওভারফ্লো" যুক্ত করতে পারেন: "লুকানো" এবং এটি দুর্দান্ত কাজ করবে।
জেপিজি

এই সমাধানটি তাত্ক্ষণিকভাবে আমার পক্ষে কার্যকর হয়নি, তবে পরিদর্শন শেষে "মার্জিন" কোথাও ওভাররাইড করা হচ্ছে। সেই উপাদানটির "মার্জিন: 0" সেট করা হচ্ছে কৌতুকটি করেছে
jooprib

19

এইচটিএমএল সিএসএস ঠিকঠাক কাজ করে যদি বডি ট্যাগ আপনি কিছু লিখতে না পারেন তবে কিছু করতে পারে

<body scroll="no" style="overflow: hidden">

এই ক্ষেত্রে ওভাররাইডিং শরীরের ট্যাগে থাকা উচিত, এটি নিয়ন্ত্রণ করা সহজ তবে কখনও কখনও মাথা ব্যথা করে।


21
এটি বৈধ HTML5 নয়
mbomb007

@ mbomb007 আপনি এখানে HTML5 সম্পর্কিত ভুল সম্পর্কে মন্তব্য করতে পারেন?
ইথান

5
@ ইথান এই scrollবৈশিষ্ট্যটি ট্যাগটিতে বৈধ নয় <body>। আমি খুঁজে পেতে পারি এমন কোনও বৈশিষ্ট্যে এটি বৈধ হিসাবে তালিকাভুক্ত নয়। w3schools ; এমডিএন ; কোয়াকিট
mbomb007

14

এই পোস্টটি সহায়ক ছিল, তবে কেবল একটি সামান্য বিকল্প শেয়ার করতে চেয়েছিল যা অন্যকে সহায়তা করতে পারে:

max-heightপরিবর্তে সেট করা heightকৌতুকটি করে। আমার ক্ষেত্রে, আমি ক্লাস টগলের ভিত্তিতে স্ক্রোলিং অক্ষম করছি। সেট .someContainer {height: 100%; overflow: hidden;}যখন ধারক উচ্চতা ভিউপোর্ট ধারক, যা না করা কি আপনি চান চাই প্রসারিত হবে যে এর চেয়ে ছোট। এটির max-heightজন্য অ্যাকাউন্টগুলি সেট করা , তবে কনটেনারের উচ্চতা যদি ভিউপোর্টের চেয়ে বেশি হয় তবে সামগ্রীটি পরিবর্তিত হয়, তবুও স্ক্রোলিং অক্ষম করে।


স্ক্রোল-শীর্ষ-শীর্ষের অবাঞ্ছিত পার্শ্ব প্রতিক্রিয়া ছাড়াই ডেস্কটপ ব্রাউজারগুলির জন্য এটি আমার দিনটি সঞ্চয় করেছে। তবে মোবাইল ব্রাউজারগুলিতে (আইফোন 5 এবং অ্যান্ড্রয়েড) কাজ করেনি।
বব

5

এটি সম্পাদন করতে, <body>উপাদানটিতে 2 টি CSS বৈশিষ্ট্য যুক্ত করুন ।

body {
   height: 100%;
   overflow-y: hidden;
}

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

দ্য টেলিগ্রাফ


এটি স্ক্রোলবারটি আড়াল করে। তবে, প্রশ্নটি বিশেষভাবে স্ক্রোলবারটি লুকানোর বিকল্পের জন্য জিজ্ঞাসা করছে
ডেটাজিউক

@ ডাটাজিক, এটি কেবল স্ক্রোলবারটি আড়াল করে না, এটি নীচে স্ক্রোল করার ক্ষমতাও বন্ধ করে দেয়। এবং আমি বুঝতে পারছি যে এটি জন্য জিজ্ঞাসা করা হয়েছিল। অর্থাত্ এটি কেবল লুকিয়ে রাখাই নয়, এটি ডাউন স্ক্রোল করাও অসম্ভব করে তুলেছে।
বিভিডিবি
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.