পৃষ্ঠা লেআউটে এর স্থান সংরক্ষণ করার সময় jQuery উপাদানটি লুকান

Question

JQuery এর এমন কোনও উপায় আছে যেখানে আমি কোনও উপাদানটি লুকিয়ে রাখতে পারি, তবে এটি যখন লুকানো হয় তখন ডিওএম পরিবর্তন করে না? আমি একটি নির্দিষ্ট উপাদান লুকিয়ে রাখছি তবে এটি যখন লুকানো থাকে তখন এর নীচের উপাদানগুলি উপরে উঠে যায়। আমি এটা চাই না। আমি চাই স্থানটি একই থাকুক, তবে উপাদানটি ইচ্ছামত প্রদর্শিত / লুকানো হোক।

আমি কি ইহা করতে পারি?

Comments

কিভাবে এটি শূন্য প্রস্থ প্রদান সম্পর্কে?

— মিষ্টারম্যান

@ মিস্টারশারম্যান: শূন্য প্রস্থকে নিরুৎসাহিত করা হয়েছে: অনেক স্ক্রিন-রিডার (অন্ধ যারা বা যারা কম দৃষ্টি রাখেন তাদের ব্যবহার করা হয়েছে) এখনও এইভাবে 'লুকানো' বিষয়বস্তু পড়ে ফেলবেন, যা সম্ভবত তাদের সামগ্রীতে বিভ্রান্ত হতে পারে ' সময় মতো এই মুহুর্তে উপলব্ধ থাকার কথা। সিএসএসের দৃশ্যমানতা ব্যবহার করা: এখানে যাওয়ার উপায়টি লুকানো।

— ব্রেন্ডনএমসিকে

আপনি fadeIn এর পূর্বে উচ্চতা গতিময়ভাবে সংরক্ষণ করতে পারেন এবং আপনার এলেমসকে ফেইড করুন) নীচে দেখুন (আমি এটি একটি পণ্য লুপে ব্যবহার করছি)) parent ('। বা-উ-বিটি')। পিতামাতা ()। পিতামাতা () পিতামাতা ( ) .হোভার (ফাংশন () {// স্থান সংরক্ষণ করুন; ডান হাইট = $ (এটি)। উচ্চতা (); $ (এটি) .সিএসএস ('উচ্চতা', রাইটহাইট); // লুকান; $ (এটি)। পিতামাতার ( )। পিতামাত ()। ('একটি স্প্যান.ফ্যামিলি দাম')। fadeOut ();}, ফাংশন () {// প্রদর্শন; $ (এটি) .ফ্যামিলি-দাম ')। ফেডইন (' ধীর ');});

— অলিভিয়ার

Answer 1

পরিবর্তে hide(), ব্যবহার করুন:

css('visibility','hidden')

hide()displayশৈলীটি এতে সেট করে none, যা ডকুমেন্ট প্রবাহ থেকে উপাদানটিকে পুরোপুরি সরিয়ে দেয় এবং এটি স্থান গ্রহণ না করার কারণ করে।

visibility:hidden জায়গা যেমন আছে তেমন রাখে।

Comments

css('visibility','visible')

— ডাঃমোল

বাcss('visibility', '')

— অ্যান্থনি ম্যাকগ্রা

Answer 2

সেট করার চেষ্টা visibilityকরতে hidden:

$("#id").css("visibility", "hidden");

Answer 3

display: none;এটি সামগ্রী প্রবাহের বাইরে নিয়ে যাবে যাতে আপনি আপনার অন্যান্য সামগ্রীটি পিছনে বাম ফাঁকা জায়গায় সরাতে দেখবেন। ( display: block;সবকিছুকে পথ থেকে সরিয়ে এনে আবার প্রবাহে নিয়ে আসে।)

visibility: hidden;এটিকে স্থান গ্রহণের বিষয়বস্তুর প্রবাহের মধ্যে রাখবে তবে কেবল অদৃশ্য করে তুলবে। ( visibility: visible;এটি আবার প্রকাশ করবে))

আপনি visibilityযদি আপনার সামগ্রীর প্রবাহ অপরিবর্তিত রাখতে চান তবে আপনি ব্যবহার করতে চাইবেন।

Answer 4

অন্য উত্তরে এটি উল্লেখ করা হয়েছে যে jQuery এর সমাপ্তি fadeToসেট display:noneকরা হয়নি তাই fadeOutউদাহরণস্বরূপ ব্যবহার না করে এখানে সমাধানও সরবরাহ করতে পারে :

jQuery, বাকী পৃষ্ঠাটি বিরক্ত না করে একটি ডিভ লুকান

Answer 5

ট্রিকটি দেখার opacity: 0আগে আমি আগে ব্যবহার করেছি visibility: hidden।

তবে অনেক ক্ষেত্রে opacity: 0সমস্যাযুক্ত, কারণ এটি আপনাকে এটি দেখতে না পারলেও উপাদানটির সাথে ইন্টারঅ্যাক্ট করতে দেয়! ( ডেডপ্যাসিভ দ্বারা চিহ্নিত হিসাবে ।)

সাধারণত আপনি যা চান তা তা নয়। তবে সম্ভবত মাঝে মাঝে আপনিও পারেন?

Comments

আপনি 0 টি অস্বচ্ছতার সাথে কোনও এলিমেন্টের সাথে করতে পারবেন এমন সময় আপনি কোনও লুকানো উপাদানের সাথে ইন্টারঅ্যাক্ট করতে পারবেন না।

— ডেডপ্যাসিভ

@ ফেস্কর আপনি যদি এমন পরিস্থিতিটি ভাবতে পারেন যেখানে এটি সুবিধাজনক হবে তবে দয়া করে শেয়ার করুন!

— জোয়েটউইডল

@ জোয়েটউইডাল স্থানটির সংরক্ষণের সময়, একটি নির্দিষ্ট অবস্থায় একটি উপাদানের সাথে মিথস্ক্রিয়া রোধ করা আমার প্রয়োজন ছিল। আমি এই বাস্তবতা সম্পর্কে সচেতন ছিলাম: দৃশ্যমানতা লুকিয়ে রাখলে স্থান রক্ষা করতে পারে, তবে জানতাম না যে এটি মিথস্ক্রিয়া রোধ করবে।

— feskr