jQuery ਪ੍ਰਭਾਵ - ਫੇਡ ਇਨ/ਫੇਡ ਆਉਟ

ਜੇਕਰੀ ਰਾਹੀਂ, ਤੁਸੀਂ ਇਲੈਕਟ੍ਰੌਨਿਕ ਅਤੇ ਸਾਈਨਲ ਦੇ ਫੇਡ ਇਨ ਫੇਡ ਆਉਟ ਇਕੱਠੇ ਕਰ ਸਕਦੇ ਹੋ।

ਪ੍ਰਭਾਵ ਪ੍ਰਦਰਸ਼ਨ

ਇੱਥੇ ਕਲਿੱਕ ਕਰੋ, ਪੈਨਲ ਛੁਪਾਓ/ਦਿਖਾਓ

ਇੱਕ ਇੰਚ ਸਮੇਂ ਇੱਕ ਇੰਚ ਸੋਨਾ, ਇਸ ਲਈ, ਅਸੀਂ ਤੁਹਾਨੂੰ ਤੇਜ਼ ਅਤੇ ਸਰਲ ਸਿੱਖਣ ਵਾਲੇ ਸਮੱਗਰੀ ਪ੍ਰਦਾਨ ਕਰਦੇ ਹਾਂ。

ਇੱਥੇ, ਤੁਸੀਂ ਸਰਲ ਅਤੇ ਸੁਵਿਧਾਜਨਕ ਢੰਗ ਨਾਲ ਜਿਸ ਗਿਆਨ ਨੂੰ ਚਾਹੁੰਦੇ ਹੋ, ਉਹ ਪ੍ਰਾਪਤ ਕਰ ਸਕਦੇ ਹੋ।

ਉਦਾਹਰਣ

jQuery fadeIn()
ਜੇਕਰੀ fadeIn() ਮੇਥਡ ਦਾ ਪ੍ਰਦਰਸ਼ਨ ਕਰੋ
jQuery fadeOut()
ਜੇਕਰੀ fadeOut() ਮੇਥਡ ਦਾ ਪ੍ਰਦਰਸ਼ਨ ਕਰੋ
jQuery fadeToggle()
ਜੇਕਰੀ fadeToggle() ਮੇਥਡ ਦਾ ਪ੍ਰਦਰਸ਼ਨ ਕਰੋ
jQuery fadeTo()
ਜੇਕਰੀ fadeTo() ਮੇਥਡ ਦਾ ਪ੍ਰਦਰਸ਼ਨ ਕਰੋ

jQuery Fading ਮੇਥਡ

ਜੇਕਰੀ ਰਾਹੀਂ, ਤੁਸੀਂ ਇਲੈਕਟ੍ਰੌਨਿਕ ਅਤੇ ਸਾਈਨਲ ਦੇ ਫੇਡ ਇਨ ਫੇਡ ਆਉਟ ਇਕੱਠੇ ਕਰ ਸਕਦੇ ਹੋ।

jQuery ਵਿੱਚ ਚਾਰ ਫੇਡ ਮੇਥਡ ਹਨ:

  • fadeIn()
  • fadeOut()
  • fadeToggle()
  • fadeTo()

jQuery fadeIn() ਮੇਥਡ

jQuery fadeIn() ਮੇਥਡ ਵਰਤਿਆ ਗਿਆ ਹੈ ਕਿ ਛੁਪੇ ਇਲੈਕਟ੍ਰੌਨਿਕ ਅਤੇ ਸਾਈਨਲ ਫੇਡ ਇਨ ਕਰੇ。

ਗਣਨਾ:

$(selector).fadeIn(speed,callback);

ਚੋਣਵਾਂ speed ਪੈਰਾਮੀਟਰ ਪ੍ਰਭਾਵ ਦੀ ਲੰਬਾਈ ਨੂੰ ਨਿਰਧਾਰਿਤ ਕਰਦਾ ਹੈ। ਇਹ ਹੇਠ ਲਿਖੇ ਮੁੱਲਾਂ ਨੂੰ ਲੈ ਸਕਦਾ ਹੈ: "slow"、"fast" ਜਾਂ ਮਿਲੀਸਕਵਾਂਡ ਮਿੱਟੀ ਹੈ。

ਚੋਣਵਾਂ callback ਪੈਰਾਮੀਟਰ ਫੇਡਿੰਗ ਪੂਰਣ ਹੋਣ ਦੇ ਬਾਅਦ ਚਲਾਉਣ ਵਾਲੇ ਫੰਕਸਨ ਦਾ ਨਾਮ ਹੈ。

ਹੇਠ ਦਾ ਉਦਾਹਰਣ ਵੱਖਰੇ ਪੈਰਾਮੀਟਰਾਂ ਵਾਲੇ fadeIn() ਮੇਥਡ ਨੂੰ ਪ੍ਰਦਰਸ਼ਿਤ ਕਰਦਾ ਹੈ:

ਉਦਾਹਰਣ

$("button").click(function(){
  $("#div1").fadeIn();
  $("#div2").fadeIn("slow");
  $("#div3").fadeIn(3000);
});

ਆਪਣੇ ਦੁਆਰਾ ਪ੍ਰਯੋਗ ਕਰੋ

jQuery fadeOut() ਮੇਥਡ

jQuery fadeOut() ਮੇਥਡ ਵਰਤਿਆ ਗਿਆ ਹੈ ਕਿ ਦਿਖਾਈ ਵਾਲੇ ਇਲੈਕਟ੍ਰੌਨਿਕ ਅਤੇ ਸਾਈਨਲ ਫੇਡ ਆਉਟ ਕਰੇ。

ਗਣਨਾ:

$(selector.fadeOut(speed,callback);

ਚੋਣਵਾਂ speed ਪੈਰਾਮੀਟਰ ਪ੍ਰਭਾਵ ਦੀ ਲੰਬਾਈ ਨੂੰ ਨਿਰਧਾਰਿਤ ਕਰਦਾ ਹੈ। ਇਹ ਹੇਠ ਲਿਖੇ ਮੁੱਲਾਂ ਨੂੰ ਲੈ ਸਕਦਾ ਹੈ: "slow"、"fast" ਜਾਂ ਮਿਲੀਸਕਵਾਂਡ ਮਿੱਟੀ ਹੈ。

ਚੋਣਵਾਂ callback ਪੈਰਾਮੀਟਰ ਫੇਡਿੰਗ ਪੂਰਣ ਹੋਣ ਦੇ ਬਾਅਦ ਚਲਾਉਣ ਵਾਲੇ ਫੰਕਸਨ ਦਾ ਨਾਮ ਹੈ。

ਹੇਠ ਦੇ ਉਦਾਹਰਣ ਵਿੱਚ fadeOut() ਮੱਥਕ ਦੇ ਵੱਖ-ਵੱਖ ਪੈਰਾਮੀਟਰਾਂ ਦਾ ਪ੍ਰਦਰਸ਼ਨ ਕੀਤਾ ਗਿਆ ਹੈ:

ਉਦਾਹਰਣ

$("button").click(function(){
  $("#div1").fadeOut();
  $("#div2").fadeOut("slow");
  $("#div3").fadeOut(3000);
});

ਆਪਣੇ ਦੁਆਰਾ ਪ੍ਰਯੋਗ ਕਰੋ

jQuery fadeToggle() ਮੱਥਕ

jQuery fadeToggle() ਮੱਥਕ fadeIn() ਅਤੇ fadeOut() ਮੱਥਕਾਂ ਦਰਮਿਆਨ ਟ੍ਰਾਂਸਫਾਰਮ ਕਰ ਸਕਦਾ ਹੈ。

ਜੇਕਰ ਅਣੂਪਾਤ ਪਰਦਾ ਖੋਲ੍ਹਿਆ ਹੈ ਤਾਂ fadeToggle() ਪਰਦਾ ਖੋਲ੍ਹਣ ਪ੍ਰਭਾਵ ਨੂੰ ਜੋੜੇਗਾ。

ਜੇਕਰ ਅਣੂਪਾਤ ਪਰਦਾ ਬੰਦ ਹੈ ਤਾਂ fadeToggle() ਪਰਦਾ ਬੰਦ ਪ੍ਰਭਾਵ ਨੂੰ ਜੋੜੇਗਾ。

ਗਣਨਾ:

$(selector).fadeToggle(speed,callback);

ਚੋਣਵਾਂ speed ਪੈਰਾਮੀਟਰ ਪ੍ਰਭਾਵ ਦੀ ਲੰਬਾਈ ਨੂੰ ਨਿਰਧਾਰਿਤ ਕਰਦਾ ਹੈ। ਇਹ ਹੇਠ ਲਿਖੇ ਮੁੱਲਾਂ ਨੂੰ ਲੈ ਸਕਦਾ ਹੈ: "slow"、"fast" ਜਾਂ ਮਿਲੀਸਕਵਾਂਡ ਮਿੱਟੀ ਹੈ。

ਚੋਣਵਾਂ callback ਪੈਰਾਮੀਟਰ ਫੇਡਿੰਗ ਪੂਰਣ ਹੋਣ ਦੇ ਬਾਅਦ ਚਲਾਉਣ ਵਾਲੇ ਫੰਕਸਨ ਦਾ ਨਾਮ ਹੈ。

ਹੇਠ ਦੇ ਉਦਾਹਰਣ ਵਿੱਚ fadeToggle() ਮੱਥਕ ਦੇ ਵੱਖ-ਵੱਖ ਪੈਰਾਮੀਟਰਾਂ ਦਾ ਪ੍ਰਦਰਸ਼ਨ ਕੀਤਾ ਗਿਆ ਹੈ:

ਉਦਾਹਰਣ

$("button").click(function(){
  $("#div1").fadeToggle();
  $("#div2").fadeToggle("slow");
  $("#div3").fadeToggle(3000);
});

ਆਪਣੇ ਦੁਆਰਾ ਪ੍ਰਯੋਗ ਕਰੋ

jQuery fadeTo() ਮੱਥਕ

jQuery fadeTo() ਮੱਥਕ ਦਿੱਤੇ ਗਏ ਅਨੁਪਾਤ (0 ਤੋਂ 1 ਤੱਕ) ਨੂੰ ਪਰਦਾ ਬੰਦ/ਖੋਲ੍ਹੋ ਪ੍ਰਭਾਵ ਨੂੰ ਲਾਜ਼ਮੀ ਕਰਦਾ ਹੈ。

ਗਣਨਾ:

$(selector).fadeTo(speed,opacity,callback);

ਲਾਜ਼ਮੀ speed ਪੈਰਾਮੀਟਰ ਪ੍ਰਭਾਵ ਦੀ ਲੰਬਾਈ ਨੂੰ ਨਿਰਧਾਰਿਤ ਕਰਦਾ ਹੈ। ਇਹ ਹੇਠ ਲਿਖੇ ਮੁੱਲਾਂ ਨੂੰ ਲੈ ਸਕਦਾ ਹੈ: "slow"、"fast" ਜਾਂ ਮਿਲੀਸਕਵਾਂਡ ਮਿੱਟੀ ਹੈ。

fadeTo() ਮੱਥਕ ਵਿੱਚ ਲਾਜ਼ਮੀ opacity ਪੈਰਾਮੀਟਰ ਫੇਡ ਇਨ/ਫੇਡ ਆਊਟ ਪ੍ਰਭਾਵ ਨੂੰ ਦਿੱਤੇ ਗਏ ਅਨੁਪਾਤ (0 ਤੋਂ 1 ਤੱਕ) ਨੂੰ ਸੈਟ ਕਰਦਾ ਹੈ。

ਚੋਣਵਾਂ callback ਪੈਰਾਮੀਟਰ ਇਸ ਫੰਕਸਨ ਦੇ ਪੂਰਣ ਹੋਣ ਦੇ ਬਾਅਦ ਚਲਾਉਣ ਵਾਲੇ ਫੰਕਸਨ ਦਾ ਨਾਮ ਹੈ。

ਹੇਠ ਦੇ ਉਦਾਹਰਣ ਵਿੱਚ fadeTo() ਮੱਥਕ ਦੇ ਵੱਖ-ਵੱਖ ਪੈਰਾਮੀਟਰਾਂ ਦਾ ਪ੍ਰਦਰਸ਼ਨ ਕੀਤਾ ਗਿਆ ਹੈ:

ਉਦਾਹਰਣ

$("button").click(function(){
  $("#div1").fadeTo("slow",0.15);
  $("#div2").fadeTo("slow",0.4);
  $("#div3").fadeTo("slow",0.7);
});

ਆਪਣੇ ਦੁਆਰਾ ਪ੍ਰਯੋਗ ਕਰੋ

jQuery ਪ੍ਰਭਾਵ ਮੈਨੂਅਲ

ਜੇਕਰ ਤੁਸੀਂ jQuery ਪ੍ਰਭਾਵਾਂ ਦਾ ਪੂਰਾ ਪੁਰਜਾ ਦੇਖਣਾ ਚਾਹੁੰਦੇ ਹੋ ਤਾਂ ਸਾਡੇ jQuery ਪ੍ਰਭਾਵ ਮੈਨੂਅਲ。