خصائص Style visibility

التعريف والاستخدام

visibility الخصائص تعين أو تعيد خاصية العنصر فيما إذا كان يجب أن يكون مرئيًا.

visibility الخصائص تسمح للمؤلف بعرض أو إخفاء العنصر.

تشبه هذه الخاصية خاصية "عرض"، ولكن الفرق هو أن إذا تم تعيين display:none، وسيخفي العنصر كله، ولكن visibility:hidden يعني أن محتويات العنصر غير مرئية، ولكن العنصر سيبقى في موقعه الأصلي و حجمه.

انظر أيضًا:

دليل CSS:CSS Display و visibility

دليل CSS:خاصية "مظاهر"

مثال

مثال 1

إخفاء محتويات عناصر <p>:

document.getElementById("myP").style.visibility = "مخفي";

نوکری کریں

توفير أمثلة إضافية في أسفل الصفحة.

النحو

إرجاع خاصية "مظاهر":

عنصر.style.visibility

تنظيم خاصية "مظاهر":

عنصر.style.visibility = "مظاهر|مخفي|سقوط|مبدئي|وراثي"

مقدار ویژگی

مقدار توضیحات
visible این عنصر دیده می‌شود. پیش‌فرض.
hidden عنصر دیده نمی‌شود، اما همچنان بر طرح تأثیر می‌گذارد.
collapse در زمان استفاده در ردیف‌ها یا سلول‌های جدول، عنصر دیده نمی‌شود (با "hidden" مشابه است).
initial این ویژگی را به مقدار پیش‌فرض خود تنظیم می‌کند. ببینید initial。
inherit از عنصر والد خود این ویژگی را ارث می‌برد. ببینید inherit。

جزئیات فنی

مقدار پیش‌فرض: visible
بازگشت مقدار: نمونہ، جو عناصر کياني کي نمائش آیا یا نه کا نشان می‌دهد.
ورژن CSS: CSS2

پشتیبانی مرورگر

کروم اگل فایرفاکس سافاری آپرا
کروم اگل فایرفاکس سافاری آپرا
پشتیبانی می‌کند پشتیبانی می‌کند پشتیبانی می‌کند پشتیبانی می‌کند پشتیبانی می‌کند

بیشتر مثال

مثال 2

تفريق بين نمائش او مخفی کرنا اور نمائش کياني:

function demoDisplay() {
  document.getElementById("myP1").style.display = "none";
}
function demoVisibility() {
  document.getElementById("myP2").style.visibility = "hidden";
}

نوکری کریں

مثال 3

ناکشاني یا نمائش عناصر کياني کي تبديل کرو:

function myFunction() {
  var x = document.getElementById('myDIV');
  if (x.style.visibility === 'hidden') {
    x.style.visibility = 'visible';
  } دیگر {
    x.style.visibility = 'hidden';
  }
}

نوکری کریں

مثال 4

نمائش او مخفی کرنا <img> عناصر:

function hideElem() {
  document.getElementById("myImg").style.visibility = "hidden"; 
}
function showElem() {
  document.getElementById("myImg").style.visibility = "visible"; 
}

نوکری کریں

مثال 5

بازگشت <p> عناصر کياني نوع دکھائش:

alert(document.getElementById("myP").style.visibility);

نوکری کریں