بلاگ نوین

استفاده از مرورگر فایرفاکس نسخه توسعه دهندگان وب

سه شنبه 09 تیر 94 | مهدی نیکدل | طراحی سایت

نسخه دولوپر فایرفاکس پارسال در مراسم دهمین سالگر فایرفاکس معرفی شد. همچنین اخیرا نسخه 64 بیتی این ورژن از فایرفاکس هم برای ویندوز، لینوکس و مکینتاش در دسترس قرار گرفته ایت. نسخه دولوپر فایرفاکس شامل ابزارهایی برای توسعه سریع تر و با قدرت بیشتر وب می باشد. شما می تونید آخرین نسخه این نرم افزار رو از اینجا دریافت و نصب کنید. اما حالا وقت این رسیده که بعضی از قابلیت های این مرورگر رو بررسی کنیم. WebIDE بوسیله WebIDE، شما قادر به ساخت، ایجاد تغییر، تست و یا رفع مشکل نرم افزارهای تحت وبتان با اجرای آنها در شبیه ساز سیستم عامل فایرفاکس بپردازید. اگه شما قصد ساخت یک وب اپلیکیشن جدید رو دارید، این شبیه ساز می تواند یک نمونه نرم افزار پایه یا حرفه ای ایجاد کند تا با ساختار آن آشنا شوید. لازم به ذکر است که WebIDE به شما اجازه اتصال به Firefox Devtools را…


ساخت براش پاشیده شدن خون برای فتوشاپ

دوشنبه 08 تیر 94 | مهدی نیکدل | فتوشاپ

موارد مورد نیاز: برگه سفید یک نقاشی رنگ روغن یک قلمو یا یک تکه چوب ساده قدم اول : آماده سازی در ابتدا، یک برگه سفید آماده کنید. برای نقاشی می تونید از بین رنگ روغن یا آب استفاده کنید. نقاشی رنگ روغن خیلی شفاف تر میشه و جلوه بهتری داره. توی این آموزش ما رنگ روغن رو انتخاب کردیم. با استفاده از تکه چوب یا قلمو رنگ را روی برگه بریزید صبر کنید تا کاملا خشک بشه. خشک  شدن نقاشی رنگ روغن بیشتر طول میکشه و تقریبا یک روز باید صبر کنید تا کاملا خشک شه. بعد از خشک شدن نقاشی اونو را یه اسکنر با کیفیت اسکن کنید. قدم دوم : ویرایش تصویر مرحله اول: نقاشی اسکن شده رو در نرم افزار فتوشاپ باز کنید و روی Add Adjustment Layer > Levels در پنل Layers کلیک کنید. پارامترها رو تا جایی به مرکز نزدیک کنید که نقاشی کنتراست…


آموزش استفاده از متد Fullscreen در HTML5

دوشنبه 08 تیر 94 | مهدی نیکدل | طراحی سایت

استفاده از این API بسیار ساده می باشد و نیازی به کدنویسی زیادی ندارد . متد های این API : دستور زیر یکی از اجزای صفحه را به حالت تمام صفحه می برد: document.requestFullScreen() این دستور تگی با آی دی canvas1 را به حالت تمام صفحه می برد: document.getElementById(“canvas1”).requestFullScreen() دستور زیر برای خارج شدن از حالت تمام صفحه است: document.cancelFullScreen() این دستور در صورتیکه کاربر در حالت تمام صفحه باشد، دستور زیر مقدار true را به عنوان خروجی باز می گرداند: document.fullScreen اگر بخواهیم بفهمیم کدام المنت در حالت تمام صفحه قرار دارد، می توانیم از این دستور استفاده کنیم: document.fullScreenElement فقط باید به این نکته مهم  نیز توجه داشت که نحوه استفاده از این متد در مرورگرهای مختلف از جمله کروم و فایرفاکس متفاوت است و باید متد خاص هر مرورگر را نیز فراخوانی کنیم و باز هم بزرگترین مشکل برنامه نویسان و طراحان وب یعنی ناسازگاری کد ها…


متد show و hide در jQuery

دوشنبه 08 تیر 94 | مهدی نیکدل | طراحی سایت

همانطور که از نام این دو متد پیداست این متد ها برای نمایش یا مخفی کردن المان ها درون صفحه به کار می روند که متد show جهت نمایش و متد hide جهت مخفی سازی یک المان به کار می رود . به مثال زیر توجه کنید : // hide element `selector` $(selector).hide(duration); // show element `selector` $(selector).show(duration); در مثال بالا دستور اول selector مورد نظر را مخفی خواهد کرد و مقدار آرگومان اول یعنی duration زمانی است که می خواهید این مخفی شدن طی کند که بر حسب میلی ثانیه محاسبه می شود و دستور دوم متد show است که دقیقا مانند متد hide است که با این تفاوت این متد بجای پنهان کردن , المان مورد نظر را نمایش خواهد داد با میزان duration که به آن پاس می دهیم . مثال زیر المان selector را در طول مدت 5 ثانیه نمایش می دهد : // show element…


قابلیت speech در HTML5

دوشنبه 08 تیر 94 | مهدی نیکدل | طراحی سایت

همواره بشر به دنبال راهکارهایی جهت راحتی زندگی خود و آسایش بیشتر و کار کمتر بوده و هست . شاید کمتر کسی فکر می کرد که در دنیای وب کار به جایی برسد که ما با صحبت کردن و حرف زدن کارهایمان را انجام دهیم ! اما اینطور نیست , در زبان HTML5 شما به api بسیار جالبی دسترسی دارید که می توانید فرمان صوتی را به نوشته تبدیل کنید ! در ادامه با ما همراه باشید شرکت گوگل یا بهتر است بگوییم این غول نرم افزاری که خود از توسعه دهنده ها و یکی از حامیان اصلی HTML5 است این api را به این زبان اضافه کرده است و البته این را هم بگوییم که این api فعلا فقط برروی مرورگر گوگل کروم کاربرد دارد و دیگر مرورگر ها از آن پشتیبانی نمی کنند اما نگران نباشید در آینده ای نزدیک همه مرورگر ها از این قابلیت جالب و…


آموزش ساخت افکت پراکندگی در فتوشاپ

دوشنبه 08 تیر 94 | مهدی نیکدل | فتوشاپ

دادن یک افکت پراکندگی یا Splatter به یک شی می تونه یه تصویر شگفت آور بسازه. بهترین قسمتش اینه که، خیلی سریع و آسونه و فقط با چند براش فتوشاپ انجام می گیره. اما نتیجه خیلی پیچیده میشه جوری که انگار چندین ساعت برای ساختش زمان برده.در این آموزش، من به شما در سه گام آسان روش ساختن اثر پراکندگی رو می آموزم. برای دیدن آموزش به ادامه نوشته بروید. ابزار در این آموزش ما به تعدادی براش Splatter نیاز داریم. که برای مثال من این براش رایگان را به شما پیشنهاد می کنم : Splatters Brush Set گام 1 بعد از مقدار کمی جستجو من این تصویر مرد در هوا (دریافت از فلیکر) را پیدا کردم. این یک تصویر عالی برای این افکت است چون شخص در حرکت است. بنابراین افکت پراکندگی به افزودن این حرکت کمک می کند. تصویر را کپی و وارد یک سند جدید فتوشاپ کنید.…