Latest web development tutorials

مسج واجهة المستخدم سبيل المثال - إخفاء (إخفاء)

استخدام تأثيرات مخصصة لإخفاء عناصر مطابقة.

لمزيد من المعلومات حول .hide() تفاصيل الأساليب، راجع وثائق API .hide () .

.hide () عرض توضيحي

انقر فوق الزر لمعاينة آثار. 

<! DOCTYPE HTML>
<الاكواد لانج = "EN">
<رئيس>
  <محارف ميتا = "UTF-8">
  <عنوان> مسج واجهة المستخدم الأثر - .hide () عرض توضيحي </ عنوان>
  <وصلة يختلط = "أنماط" أ href = "// code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <سيناريو SRC = "// code.jquery.com/jquery-1.9.1.js"> </ script>
  <سيناريو SRC = "// code.jquery.com/ui/1.10.4/jquery-ui.js"> </ script>
  <وصلة يختلط = "أنماط" أ href = "http://jqueryui.com/resources/demos/style.css">
  <نمط>
  .toggler {العرض: 500px؛ الطول: 200px؛}
  #button {الحشو: .5em 1em؛ النص الديكور: لا شيء؛}
  #effect {العرض: 240px؛ الطول: 135px؛ الحشو: 0.4em، موقع: نسبي؛}
  #effect H3 {هامش: 0؛ الحشو: 0.4em؛ مواءمة النصوص: مركز؛}
  </ النمط>
  <script>
  $ (وظيفة () {
    // تشغيل المحدد حاليا وظيفة تأثير runEffect () {
      // اشتقاق آثار نوع فار selectedEffect = $ ( "#effectTypes") .val ()؛
 
      // معظم الآثار لا تحتاج إلى كتابة خيارات خيارات التسليم الافتراضي فار = {}؛
      // بعض المؤثرات الخاصة مع المعلمات المطلوبة إذا (selectedEffect === "على نطاق") {
        خيارات = {المئة: 0}؛
      } آخر إذا (selectedEffect === "حجم") {
        خيارات = {ل: {عرض: 200، الطول: 60}}؛
      }
 
      // آثار تشغيل $ ( "#effect") .hide (selectedEffect، الخيارات، 1000، رد)؛
    }؛
 
    // وظيفة استدعاء الاستدعاء () {
      setTimeout (وظيفة () {
        $ ( "#effect") .removeAttr ( "ستايل") .hide () fadeIn ()؛
      }، 1000)؛
    }؛
 
    // تعيين القيمة وفقا لاختيار الآثار القائمة $ ( "#button"). انقر (وظيفة () {
      runEffect ()؛
      عودة كاذبة.
    })؛
  })؛
  </ script>
</ رئيس>
<body>
 
<div الطبقة = "toggler">
  <شعبة معرف = "تأثير" الطبقة = "واجهة المستخدم القطعة-المحتوى واجهة المستخدم الزاوية للجميع">
    <H3 الطبقة = "واجهة المستخدم القطعة-رأس واجهة المستخدم الزاوية للجميع"> إخفاء (إخفاء) </ H3>
    <P>
      Etiam يبيرو neque، luctus لذلك، eleifend اللجنة الوطنية للانتخابات، سمبر في، أبجد. سد الر. metus لا عقوبة أبجد، adipiscing التحرير، luctus الحوار الاقتصادي الاستراتيجي، hendrerit الذاتية، ميل.
    </ P>
  </ div>
</ div>
 
<اختر اسم = "الآثار" معرف = "effectTypes">
  <قيمة الخيار = "العمياء"> ظلال الآثار (مكفوفين تأثير) </ خيار>
  <الخيار قيمة = "ترتد"> حدوث آثار ارتدادية (ترتد تأثير) </ خيار>
  <الخيار قيمة = "كليب"> آثار كليب (كليب تأثير) </ خيار>
  <قيمة الخيار = "قطرة"> آثار الهبوط (قطرة تأثير) </ خيار>
  <الخيار قيمة = "تنفجر"> آثار الانفجار (تنفجر تأثير) </ خيار>
  <الخيار قيمة = "اضعاف"> آثار للطي (أضعاف تأثير) </ خيار>
  <الخيار قيمة = "تسليط الضوء"> تأثيرات الإضاءة (تسليط الضوء على تأثير) </ خيار>
  <الخيار قيمة = "نفخة"> آثار التوسع (النفخة تأثير) </ خيار>
  <الخيار قيمة = "خفق"> فاز الآثار (خفق تأثير) </ خيار>
  <الخيار قيمة = "نطاق"> آثار تكبير (مقياس تأثير) </ خيار>
  <الخيار قيمة = "زعزعة"> آثار الاهتزاز (اهتز تأثير) </ خيار>
  <الخيار قيمة = "حجم"> آثار الحجم (حجم تأثير) </ خيار>
  <الخيار قيمة = "الانزلاق"> آثار شريحة (الشرائح تأثير) </ خيار>
</ تحديد>
 
<a href="#" id="button" class="ui-state-default ui-corner-all"> تشغيل آثار </A>
 
 
</ الجسم>
</ HTML>