از حدس زدن ارتفاع خط به طوری که متن دقیقاً به اندازه یک حرف Capital شود خسته شده اید؟ خسته نباشید!
🔗https://caniuse.com/?search=cap%20unit
#️⃣#tip #css
🆔@IR_javascript
line-height: 1cap;
🔗https://caniuse.com/?search=cap%20unit
#️⃣#tip #css
🆔@IR_javascript
در این سایت فونت برای هر سلیقه و سبکی پیدا خواهید کرد. و 17 هزار صفحه نشان دهنده اندازه چشمگیر این مجموعه است.
🔗https://fonts.do/
#️⃣#tool
🆔@IR_javascript
🔗https://fonts.do/
#️⃣#tool
🆔@IR_javascript
Cally: Small, Feature-Rich Calendar Components
تقویمی کوچک و کم حجم اما پر امکانات که از جمله ویژگی های آن
اندازهی کوچک بسته- کمتر از 9 کیلوبایت در حالت فشرده/فشرده شده با gzip
مجموعه امکانات کامل - تاریخهای تکی، دامنهای، نمایش چند ماه
وابستگیهای کم - تنها یکی
قابل دسترسی - کیبورد و صفحه خوان
قابلیت تغییرزبان - Intl.DateTimeFormat ، خواص CSS ، پشتیبانی از RTL
قابل تغییر قالب - اجزاء CSS و ویژگیهای سفارشی
🔗 https://wicky.nillia.ms/cally/
#️⃣#npm_module
🆔@IR_javascript
تقویمی کوچک و کم حجم اما پر امکانات که از جمله ویژگی های آن
اندازهی کوچک بسته- کمتر از 9 کیلوبایت در حالت فشرده/فشرده شده با gzip
مجموعه امکانات کامل - تاریخهای تکی، دامنهای، نمایش چند ماه
وابستگیهای کم - تنها یکی
قابل دسترسی - کیبورد و صفحه خوان
قابلیت تغییرزبان - Intl.DateTimeFormat ، خواص CSS ، پشتیبانی از RTL
قابل تغییر قالب - اجزاء CSS و ویژگیهای سفارشی
<calendar-range
value="2024-01-10/2024-01-20"
min="2024-01-01"
max="2024-12-31"
locale="fa-IR"
months="2"
first-day-of-week=-1
dir="rtl"
>
<calendar-month></calendar-month>
<calendar-month offset="1"></calendar-month>
</calendar-range>
🔗 https://wicky.nillia.ms/cally/
#️⃣#npm_module
🆔@IR_javascript
👍2❤1👎1
target vs currentTarget in js
به طور کلی:
target عنصری است که کاربر روی آن کلیک کرده است
CurrentTarget عنصری است که listener به آن اختصاص داده شده است.
مثال:
وقتی روی دکمه کلیک شود خروجی مطابق زیر است:
#️⃣#tip
🆔@IR_javascript
به طور کلی:
target عنصری است که کاربر روی آن کلیک کرده است
CurrentTarget عنصری است که listener به آن اختصاص داده شده است.
مثال:
<div id="outer">
Outer div
<button id="inner">Inner Button</button>
</div>
const outer = document.getElementById('outer');
outer.addEventListener('click', function (event) {
console.log('event.target:', event.target.id);
console.log('event.currentTarget:', event.currentTarget.id);
});
وقتی روی دکمه کلیک شود خروجی مطابق زیر است:
event.target: inner
event.currentTarget: outer
#️⃣#tip
🆔@IR_javascript
👍2
This media is not supported in your browser
VIEW IN TELEGRAM
Quokka.js یک ابزاربرای افزایش بهره وری در حین توسعه است وکمک می کند همانطور که شما تایپ می کنید مقادیری که متغیر ها گرفته اند را نیز مشاهده کنید.
#️⃣#tool
🆔@IR_javascript
#️⃣#tool
🆔@IR_javascript
👍2
Bruno یک سرویس تست API منبع باز است، جایگزینی برای ابزارهایی مانند Postman یا Insomnia که فقط آفلاین کار می کند.
🔗https://github.com/usebruno/bruno
#️⃣#tool
🆔@IR_javascript
🔗https://github.com/usebruno/bruno
#️⃣#tool
🆔@IR_javascript
This media is not supported in your browser
VIEW IN TELEGRAM
کار با Resize Observer برای ردیابی تغییرات اندازه عنصر
Resize Observer به شما این امکان را می دهد که تغییرات اندازه عناصر را کنترل کنید و به آنها در کد خود واکنش نشان دهید.
#️⃣#tip
🆔@IR_javascript
Resize Observer به شما این امکان را می دهد که تغییرات اندازه عناصر را کنترل کنید و به آنها در کد خود واکنش نشان دهید.
const resizeObserver = new ResizeObserver(entries => {
for (const entry of entries) {
console.log('ابعاد عنصر تغییر کرده است:',entry.target);
}
});
const resizableElement = document.getElementById('resizable');
resize0bserver.observe(resizableElement);
#️⃣#tip
🆔@IR_javascript
👍1
کتابخانه جاوا اسکریپت برای ایجاد فایلهای pdf در سمت کلاینت که به تولید بلیط رویداد، گواهیها یا پوستر کمک میکند.
توضیحات بیشتر در مورد زبان فارسی در jsPDF [+لینک]
🔗 https://github.com/parallax/jsPDF?tab=readme-ov-file
#️⃣#npm_module
🆔@IR_javascript
توضیحات بیشتر در مورد زبان فارسی در jsPDF [+لینک]
🔗 https://github.com/parallax/jsPDF?tab=readme-ov-file
#️⃣#npm_module
🆔@IR_javascript
👍2
This media is not supported in your browser
VIEW IN TELEGRAM
text-align-last
با خط آخر به صورت جداگانه کار می کند و به شما امکان می دهد تا انتقال متنی را انجام دهید که برای چشم دلپذیرتر است
🔗https://caniuse.com/?search=text-align-last
🔗https://www.stefanjudis.com/today-i-learned/how-to-align-the-text-of-the-last-paragraph-line/
#️⃣#tip #css
🆔@IR_javascript
با خط آخر به صورت جداگانه کار می کند و به شما امکان می دهد تا انتقال متنی را انجام دهید که برای چشم دلپذیرتر است
🔗https://caniuse.com/?search=text-align-last
🔗https://www.stefanjudis.com/today-i-learned/how-to-align-the-text-of-the-last-paragraph-line/
#️⃣#tip #css
🆔@IR_javascript
👍2
Validate.js
کتابخانه ای که متد هایی را برای اعتبارسنجی و sanitizes رشته ها در جاوا اسکریپت ارائه می دهد. که در سمت سرور و کلاینت قابل استفاده است
🔗 https://github.com/validatorjs/validator.js
#️⃣#npm_module
🆔@IR_javascript
کتابخانه ای که متد هایی را برای اعتبارسنجی و sanitizes رشته ها در جاوا اسکریپت ارائه می دهد. که در سمت سرور و کلاینت قابل استفاده است
🔗 https://github.com/validatorjs/validator.js
#️⃣#npm_module
🆔@IR_javascript
یکی از جالب ترین ویژگی های ECMAScript 2023 امکان تغییر یک آرایه با گرفتن یک کپی از آن است. یعنی با تغییر آرایه با این روش اول یک کپی سطحی [+لینک] از آن گرفته می شود سپس تغییرات شما بر روی نسخه کپی اعمال می شود.
toReversed، toSorted، toSpliced از آن جمله اند که درECMAScript 2023 اضافه شدند
#️⃣#tip
🆔@IR_javascript
toReversed، toSorted، toSpliced از آن جمله اند که درECMAScript 2023 اضافه شدند
#️⃣#tip
🆔@IR_javascript