یک پروژه ساده هست با ajax که وقتی روی یک دکمه کلیک می کنیم، اطلاعات یوزرها رو از api سایت گیت هاب دریافت میکنه و المان های html هر یوزر رو می سازه و در نهایت توی صفحه html اونها رو append میکنه. <!DOCTYPE html> <html lang=”fa”> <head> <meta charset=”UTF-8″> <meta name=”viewport” content=”width=device-width, initial-scale=1.0″> <title>Document</title> … ادامه
توسط ajax می توانیم بدون رفرش شدن صفحه داده ای رو از سمت سرور بگیریم و پردازش بکنیم، در ادامه با همراه کد اون رو توضیح دادیم: const txtDiv = document.querySelector(“.mydiv”); const myBtn = document.querySelector(“.Btn”); myBtn.addEventListener (“click” , loadText); function loadText (){ var xhr = new XMLHttpRequest (); xhr.open(“GET” , “text.txt” , true); xhr.onprogress = … ادامه
https://www.jslint.com https://jshint.com
این پروژه یک متنی رو نشون میده و شما باید اون متم رو در کادر زیرش تایپ کنید تا به شما بگه سرعت تایپتون چقدر، اگه کاراکتری رو اشتباه وارد کنید رنگ حاشیه textarea تغییر میکنه و یک صدای beep هم پخش میکنه که شما متوجه باشید که دارید اشتباه تایپ می کنید. اگر متن … ادامه
متغییرها در JS نحوه تعریف متغییر در جاوا اسریپت به روش های مختلف انجام میشه که می تونیم به Var، let و… اشاره کنیم. در زیر نمونه کد تغییر متغییر آورده شده است: var a; var b, c, x; var num = 125 ; // integer – number var name = “ashkan”; // string var … ادامه
توسط قابلیت Grid می توانیم بخش بندی و گرید بندی صفحات html رو انجام بدیم، ما در این مقاله به مطالب مهم این حوزه اشاره کرده ایم. Grid برای استفاده از گرید بندی باید حالت نمایشی المان پدر رو روی حالت grid قرار دهیم. .container { display: grid; } Grid-template-columns توسط این پراپرتی می توانیم … ادامه
فلکس باکس (FlexBox) چیست و چه کاربردی دارد؟ Flexible Box Layout قابلیت جدید CSS است که برای مرتب کردن و طرح بندی عناصر داخلی یک کانتینر کاربرد دارد، با استفاده از فلکس باکس می می توانیم مدیریت بهتری بر روی عناصر داخلی یک بخش داشته باشیم. در ادامه با جزئیات و سایر پراپرتی های فلکس … ادامه
لینک پیش نمایش: https://liveweave.com/xzqWKH این پروژه نکات خوبی در خصوص پوزیشن ها داشت میتونید لینک پروژه رو بالا ببینید.
لینک پیش نمایش: https://liveweave.com/43lsup در این تمرین یک دکمه داریم که وقتی ماوس میره روش یک منوی زیر مجموعه براش باز میشه که استایل های اون و نحوه اعمال حالت انیمالش خیلی نکات داره این تمرین توی دوره css سبزلرن با تدریس حمیدرضا عبادی خواسته شده بود.
در اینجا ادیتور های آنلاین اچ تی ام ال و سی اس اس رو خدمتتون معرفی می کنیم که توسط اونها می توانید اولا کدتون رو آنلاین تست بگیرید و پیش نمایشی ازش رو مشاهده کنید و دوما لینکش رو شیر کنید با بقیه. liveweave.com codepen.io