آموزش رایگان ساخت فول اسکرین کردن (FullScreen) صفحات سایت با جاوا اسکریپت
کاملترین قالب HTML فروشگاهی سایت دیجی کالا
با خرید قالب HTML دیجی کالا، یک قالب HTML شخصی به ارزش 250 هزار تومان هدیه دریافت نمایید
- آیا تازه شروع به یادگیری طراحی سایت کردی و دنبال نمونه کدهای کاربردی و مناسب بازار کار می گردی؟
- یا دانشجو هستی و باید پروژه ای رو آخر ترم تحویل استادت بدی.
- یا بک اند کار هستی و نمی خوای هزینه چند ده میلیونی بابت طراحی قالب استاتیک سایت کنی.
- یا طراح قالب وردپرس هستی و دنبال یه قالب HTML فروشگاهی حرفه ای مطابق سلیقه ایرانی می گردی.
- یا می خوای داخل یک شرکت معتبر طراحی سایت استخدام بشی و به اون شغل به شدت نیاز داری و باید رزومه کار حرفه ای برای استخدام بفرستی.
- یا مدرس طراحی سایت هستی و دنبال نمونه کد کاربردی برای تدریس می گردی.
- اصلا نگران نباش، چرا که تیم توسعه میهن جاوا اسکریپت یک قالب HTML فروشگاهی حرفه ای تحت عنوان قالب HTML مشابه سایت دیجی کالا منتشر کرده که نیاز شما رو مرتفع میکنه که برای اطلاعات بیشتر روی دکمه مشاهده پیشنمایش قالب HTML دیجی کالا کلیک نمایید.
فول اسکرین کردن صفحات سایت با استفاده از جاوا اسکریپت
همانطور که می دونید Full screen به معنای تمام صفحه هستش، حالا در نظر بگیرید می خواهید وارد سایتی بشید و مقاله ای رو بخونید خب مرورگرتون رو باز می کنید و شروع می کنید به جستجو کردن و وارد سایت هدفتون میشید و خواهید دید در بالا و پایین مرورگر نواری وجود داره حالا برای این که این نوارها حواستون رو پرت نکنن و تمرکز خیلی بالاتری به مطالب داشته باشید تنها با زدن دکمه F11 مرورگرتون تمام صفحه یا همون فول اسکرین میشه که با زدن دکمه Esc می تونید از حالت Full screen خارج بشید.
و اما شما به عنوان یک طراح سایت شاید ایده ای داشته باشید که بخواهید در سایتی که طراحی می کنید بخشی رو پیاده سازی کنید که کاربر با زدن دکمه ای که شما مشخص کردید بتونه مرورگر رو فول اسکرین کنه که دیگه مجبور نباشه کلید F11 رو بزنه بلکه اون برنامه ای که شما پیاده سازی کردید این کار رو انجام بده.
در نسخهٔ HTML5 یک ای‌پی‌آی (API) در اختیار دولوپرها قرار گرفته که با استفاده از آن می‌توان امکانی رو در اختیار کاربران سایت قرار داد که با کلیک بر روی دکمه‌ای خاص، صفحهٔ مرورگر را به حالت فول‌اسکرین درآورد به طور کلی، از جمله کاربردهای این ای‌پی‌آی می‌توان به گیم‌‌های آنلاین، اسلایدشو، نمایش ویدیو و … اشاره کرد علاوه بر اینکه با استفاده از این ای‌پی‌آی هم می‌توان کل صفحه را فول‌اسکرین کرد و هم اِلِمان خاصی رو هدف قرار داد.
بسته به نوع مرورگری که از آن استفاده می‌کنیم، متدهای ارتباط با مرورگر نیز در این ای‌پی‌آی متفاوتند. به طور مثال، در فایرفاکس باید متد mozRequestFullScreen فراخوانی بشه اما این در حالی است که در مرورگرهای گوگل کروم و سافاری که مبتنی بر موتور رِندِرینگ WebKit هستند باید متد webkitRequestFullScreen رو فراخوانی کرد.
این نکته رو هم اضافه کنم که HTML5 Fullscreen API ابزاری کاربردی هستش تا از آن طریق امکانی رو در اختیار کاربران سایت خود قرار دهیم که در نهایت منجر به ایجاد تجربهٔ کاربری بهتری گردد، اما فراموش نکنیم که ممکنه در طول زمان نحوهٔ عملکرد این API دستخوش تغییر بشه و یا عرضه‌کنندگان مرورگرهای مختلفی مثل فایرفاکس، گوگل کروم، سافاری و … سازوکاری اختصاصی خود برای کنترل آن را تغییر دهند که به همین دلیل نیاز هستش تا تغییرات در مستندات این API رو زمانی که قصد استفاده از آن را داریم رصد کنیم.
برای این که با این API بیشتر آشنا بشید مینی پروژه ای رو آماده کردم که در ابتدای مقاله دکمه های مشاهده در آپارات و یوتیوب رو قرار دادم و همچنین برای دریافت سورس پروژه بر روی دکمه دریافت رایگان سورس پروژه کلیک نمایید.
میلیون‌ها کیلومتر اسکرول کردم تا به هدفم نزدیک بشم و این داستان همچنان ادامه داره...
مجموعه آموزش های رایگان و پروژه محور جاوااسکریپت
به میهن جاوا اسکریپت خوش اومدی ، اینجا میتونی مینی پروژه های کاربردی جاوااسکریپت که مد نظر داری رو پیدا کنی،آموزش های میهن جاوااسکریپت کاملا از صفر تا صد طراحی شده و تمامی آموزش ها به زبان فارسی و مناسب جهت ورود به بازار کار تولید شده.آموزشی که مشاهده کردید بخشی از مجموعه آموزش های رایگان و پروژه محور JavaScript هستش که توصیه میشه برای یادگیری بیشتر مباحث جاوااسکریپت به ترتیب، آموزش های رایگان و پروژه محور زیر که کاملا مناسب بازار کار میباشد رو مشاهده نمایید:
نظر/پرسش/پیشنهاد شما
برای ارسال نظر لطفا ابتدا وارد شوید.