Latest web development tutorials

مثال مسج واجهة المستخدم - إزالة فئة (إزالة فئة)

عندما تغير أسلوب الرسوم المتحركة لكل عنصر من مجموعة من العناصر المتطابقة إزالتها ضمن فئة محددة.

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

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

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

<! DOCTYPE HTML>
<الاكواد لانج = "EN">
<رئيس>
  <محارف ميتا = "UTF-8">
  <عنوان> مسج واجهة المستخدم الأثر - .removeClass () عرض توضيحي </ عنوان>
  <وصلة يختلط = "أنماط" أ 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؛ الحشو: 1em؛ mso-: 0؛ حجم الخط: 1.2em؛ الحدود: 1PX الصلبة # 000؛ الخلفية: #eee؛ اللون: # 333؛}
  .newClass {نص المسافة البادئة: 40px؛ mso-: .4em، العرض: 410px؛ الطول: 100px؛ الحشو: 30px؛ هامش: 10px؛ حجم الخط: 1.6em؛}
  </ النمط>
  <script>
  $ (وظيفة () {
    $ ( "#button"). انقر (وظيفة () {
      $ ( "#effect") .removeClass ( "NewClass"، 1000، رد)؛
      عودة كاذبة.
    })؛
 
    رد وظيفة () {
      setTimeout (وظيفة () {
        $ ( "#effect") .addClass ( "NewClass")؛
      }، 1500)؛
    }
  })؛
  </ script>
</ رئيس>
<body>
 
<div الطبقة = "toggler">
  <شعبة معرف = "تأثير" الطبقة = "newClass واجهة المستخدم الزاوية للجميع">
    Etiam يبيرو neque، luctus لذلك، eleifend اللجنة الوطنية للانتخابات، سمبر في، أبجد. الر سد.
  </ div>
</ div>
 
<a href="#" id="button" class="ui-state-default ui-corner-all"> تشغيل آثار </A>
 
 
</ الجسم>
</ HTML>