scaleY ဖန်ရှင်

scaleY ဖန်ရှင်သည် element တစ်ခုကို Y ဝင်ရိုးတစ်လျှောက် အရွယ်အစားချဲ့ပေးသည်။ အရွယ်အစားချဲ့ခြင်းကို transform-origin ဂုဏ်သတ္တိဖြင့် သတ်မှတ်ပေးထားသော အမှတ်ကို အခြေခံ၍ လုပ်ဆောင်ပါသည်။ ဖန်ရှင်၏ တန်ဖိုးသည် ကိန်းပြည့် သို့မဟုတ် ကိန်းဆိုင်ရာ ကိန်းတစ်ခု ဖြစ်သည်။ ၎င်းသည် 1 ထက် ကြီးပါက element ကို ကြီးထွားစေပြီး၊ ပိုငယ်ပါက (ဥပမာ၊ 0.5) element ကို သေးငယ်စေသည်။ 1 ဟု သတ်မှတ်ပါက ဘာမှ ပြောင်းလဲမှုမရှိပါ (၎င်းသည် ပုံသေတန်ဖိုး ဖြစ်သည်)။

ဝါကျဖွဲ့စည်းပုံ

cssselector {
  transform: scaleY(number);
}

ဥပမာ

ဘလောက်တစ်ခုပေါ်သို့ ဆောင့်ကြွားလိုက်သောအခါ Y ဝင်ရိုးတစ်လျှောက် 1.5 ဆ အရွယ်အစားချဲ့မည်။

html<div id="elem">lorem ipsum</div>

css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: scaleY(1.5);
}

Результат:

ဥပမာ

ဘလောက်တစ်ခုပေါ်သို့ ဆောင့်ကြွားလိုက်သောအခါ Y ဝင်ရိုးတစ်လျှောက် 2 ဆ အရွယ်အစားလျှော့ချမည်။

html<div id="elem">lorem ipsum</div>

css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: scaleY(0.5);
}

Результат:

ဤသည်ကိုလည်း ကြည့်ပါ