jQuery ဖြစ်ပေါ်လာမှု - အနုပညာ

jQuery

jQuery



jQuery

jQuery animate() မူကား အချက်အလက် အများစု ကို အသုံးပြုရမည်။

效果演示

开始动画

jQueryjQuery animate() မူကား အချက်အလက် အများစု ကို အသုံးပြုရမည်။语法：,$(paramsselectorcallback).animate({

}, , );

အချက်အလက် အများစု ကို အသုံးပြုရမည်။ params speed

အချက်အလက် အများစု ကို အသုံးပြုရမည်။ callback အပြီးအပိုင်း အချက်အလက် အများစု ကို အသုံးပြုရမည်။

အခြေအနေအားဖြင့် အချက်အလက် အများစု ကို အသုံးပြုရမည်။ ဥပမာ၊ အချက်အလက် အများစု ကို အသုံးပြုရမည်။ ဥပမာ၊ အချက်အလက် အများစု ကို အသုံးပြုရမည်။

အမှတ်အသား

$("button").click(function(){
  $("div").animate({left:'250px'});
});

ကိုယ်တိုင် ကြိုးစားလုပ်ကြည်း

အကြောင်းကြားချက်:အခြေအနေအားဖြင့် ချီးဖူးသော HTML အချက်အလက် အား အချက်အလက် အများစု ကို အသုံးပြုရမည်။

အခြေအနေအားဖြင့် အချက်အလက် ပြင်ကျင့် position ကို အရေးကြီးသော်လည်း အချက်အလက် အများစု ကို အသုံးပြုရမည်။ ဥပမာ၊ အရေးကြီးသော်လည်း အချက်အလက် ပြင်ကျင့် position ကို အရေးကြီးသော်လည်း အချက်အလက် အများစု ကို အသုံးပြုရမည်။

jQuery animate() - အချက်အလက် အများစု ဖြင့် ဖြင့်

သတိပြုရန် အပြီးသတ် အသုံးပြုတဲ့ အချက်အလက် အများစု ကို အပူဇော်အားဖြင့် အသုံးပြုနိုင်ပါတယ်။

အမှတ်အသား

$("button").click(function(){
  $("div").animate({
    left:'250px',
    opacity:'0.5',
    height:'150px',
    width:'150px'
  });
});

ကိုယ်တိုင် ကြိုးစားလုပ်ကြည်း

အကြောင်းကြားချက်:animate() မူကား ချီးဖူးသော CSS အချက်အလက် ကို ဖြင့် လုပ်ဆောင်နိုင်ပါတယ်လား။

မသိပါဘူး၊ တောင်မျှ အတိုင်းအတာ ဖြစ်နိုင်ပါတယ်၊ သို့သော် အရေးကြီးသော အချက် တစ်ခု ဝေးကွာမှု ကျင့်သုံးသင့်ပါတယ်။ ပြီးခဲ့သော်လည်း အသုံးပြုတဲ့ animate() မှာ အချက်အလက် အမည် ကို ချီးဖူးသော လက်ရာဖြင့် ရေးသားရမည်။ ဥပမာ၊ ပြင်ကျင့်အား padding-left သော်လည်း ပြင်ကျင့်အား padding ကို အသုံးပြု ရမည်၊ အရှေ့ဘက်အား margin-right သော်လည်း အရှေ့ဘက်အား margin ကို အသုံးပြု ရမည်၊ ပြီး အားလုံးကြီးတို့ကို ဖြင့်။

同时，色彩动画并不包含在核心 jQuery 库中。

如果需要生成颜色动画，您需要从 jQuery.com 下载 Color Animations 插件。

jQuery animate() - 使用相对值

也可以定义相对值（该值相对于元素的当前值）。需要在值的前面加上 += 或 -=：

အမှတ်အသား

$("button").click(function(){
  $("div").animate({
    left:'250px',
    height:'+=150px',
    width:'+=150px'
  });
});

ကိုယ်တိုင် ကြိုးစားလုပ်ကြည်း

jQuery animate() - ပြုလုပ်ထားသော အကွက် တို့ အား အဘ်ဘ် လုပ်ဆောင်ခြင်း

အခြား အကွက် တို့ ကို ကိုယ်တိုင် ပြောင်းလဲပြီး မှတ်သားထားသော အကွက် တို့ ကို လုပ်ဆောင်လိမ့်မည် ကြောင်း သင့်သာ ပြောင်းလဲနိုင်ပါသည်: "show"、"hide" သို့မဟုတ် "toggle":

အမှတ်အသား

$("button").click(function(){
  $("div").animate({
    height:'toggle'
  });
});

ကိုယ်တိုင် ကြိုးစားလုပ်ကြည်း

jQuery animate() - အဘ်ဘ် လုပ်ဆောင်ခြင်း အား အဘ်ဘ် လုပ်ဆောင်ခြင်း

လက်ဆင့် မူကြမ်းတွင် လုပ်ဆောင်ရမည် ကြောင်း လက်ဆင့် jQuery သည် လှုပ်ရှားမှု အတွက် အဘ်ဘ် လုပ်ဆောင်ခြင်း အား အဘ်ဘ် လုပ်ဆောင်ခြင်း အား ပြုလုပ်ထားသည်။

ဤ သို့ အခြား အကွက် တို့ ကို အခြား အကွက် တို့ ပြီးတော့ မှာ မှတ်သားထားသော animate() ခုခု ကို လုပ်ဆောင်ရမည် ကြောင်း သတ်မှတ်ထားသည်မှာ တခုခု ဖြစ်သည်။ နောက်မှ အဆင့်ဆင့်ပြီး အဆင့်ဆင့် အကွက် တို့ ကို လုပ်ဆောင်လိမ့်မည် ဖြစ်သည်။

အမှတ်အသား 1

သို့သော် အခြား အကွက် တို့ အကြား အမျိုးမျိုးသော အရေးပါ လှုပ်ရှားမှု မှာ လုပ်ဆောင်လိမ့်မည် ကြောင်း မူကြမ်း တစ်ခု အသုံးပြုပါသည်:

$("button").click(function(){
  var div=$("div");
  div.animate({height:'300px',opacity:'0.4'},"slow");
  div.animate({width:'300px',opacity:'0.8'},"slow");
  div.animate({height:'100px',opacity:'0.4'},"slow");
  div.animate({width:'100px',opacity:'0.8'},"slow");
});

ကိုယ်တိုင် ကြိုးစားလုပ်ကြည်း

အမှတ်အသား 2

အောက်ပါ အမှတ်အသား က <div> အကွက် ကို အရှေ့ဘက်သို့ ပြောင်းလဲပြီး စာလုံး အရွယ် ကို တိုးပေးပါသည်:

$("button").click(function(){
  var div=$("div");
  div.animate({left:'100px'},"slow");
  div.animate({fontSize:'3em'},"slow");
});

ကိုယ်တိုင် ကြိုးစားလုပ်ကြည်း