Learning Center
Learning Center
  • HTML
  • CSS
  • JAVASCRIPT
  • Bootstrap
  • React
  • jQuery
  • NodeJs
  • Sql
  • MySql
  • Python
  • OpenVPN Setup
  • Log In
Coding Choice Home About Contact ☰

  1. You are here
  2. Home
  3. jquery
  4. animations_and_effects

Sidebar
  • Introduction
  • Setting Up jQuery
  • Selecting Elements
  • Event Handling
  • Manipulating the DOM
  • Animations and Effects
  • AJAX with jQuery
  • jQuery Plugins
  • Advanced jQuery Techniques
  • Share via
    • Share via...
    • Twitter
    • LinkedIn
    • Facebook
    • Pinterest
    • Telegram
    • WhatsApp
    • Yammer
    • Reddit
    • Teams
  • Send via e-Mail
  • Print
  • Permalink

Animations and Effects

Show and Hide

$("#panel").hide();
$("#panel").show();

Fade Effects

$("#box").fadeOut();
$("#box").fadeIn();
$("#box").fadeToggle();

Slide Effects

$("#menu").slideUp();
$("#menu").slideDown();
$("#menu").slideToggle();

Custom Animations

$("#box").animate({ left: '250px', opacity: '0.5' }, 1000);