جهت ورود به تالار گفتمان سایت کلیک کنید


آموزش ساخت پیام ‍‍Snackbar Popup با جاوا اسکریپت

حتما تابحال اسم این نوع نمایش پاپ آپ را نشنیده باشید و این پست براتون گنگ و مبهم باشد …

Snackbaar PopUp , یک پیام به صورت تولتیپی میباشد که در پایین وب سایت به نمایش در می آید و میتوانید آن را پس از چند ثانیه محو کنید .

این نوع پیام ها بیشتر برای اطلاع از یک نوع خطای خاص یا اخطار و یا موفقیت آمیز بودن یک مرحله و نمایش آن به کاربران استفاده میشود . در ادامه با آموزش ساخت این نو PopUp با استفاده از Css3 و Java Script آشنا می شویم .

آموزش ساخت پیام ‍‍Snackbar Popup با جاوا اسکریپت

در ابتدا کد زیر را در HTML وب سایت خود قرار دهید . این کد متن نمایشی شما میباشد . پس میتوانید نوشته ی درون آن را تغییر دهید .

حال کد های زیر را در css وب سایت خود قرار دهید :

حال کد زیر را در Js وب سایت خود قرار دهید :

و در آخر نوب به صدا زدن کد های بالا میرسه که شما میتوانید با خاصیت Onclick این کار را انجام بدهید . کافیست به تگ مورد نظر در Html خاصیت Onclick را بدهید و مقدار آن را ()SnackBar_vms قرار دهید .

مثلا در کد زیر این خاصیت به تگ button داده شده است . یعنی اگر روز این دکمه کلیک شد , Popup باز شود .

دموی آماده SnackBar Popup

گرداوری و آموزش : وحید مجیدی

پخش اختصاصی

  • امتیاز شما به این مقاله ؟
    خیلی بدبدمعمولیخوبخیلی خوب (لطفا رای بدید)
  • جهت تبادل گفتگو و حل مشکلات در باره این موضوع , کلیک کنید

    یک پاسخ به “آموزش ساخت پیام ‍‍Snackbar Popup با جاوا اسکریپت”

    1. سید گفت:

      سلام و سپاس

      http://www.xn--mgbguh09aqiwi.com/%D8%A2%D9%85%D9%88%D8%B2%D8%B4-%D8%B3%D8%A7%D8%AE%D8%AA-%D9%BE%DB%8C%D8%A7%D9%85-%E2%80%8D%E2%80%8Dsnackbar-popup-%D8%A8%D8%A7-%D8%AC%D8%A7%D9%88%D8%A7-%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA.html#more-21763

      کپچای سایت برا نظر دادن ارور میده

      با سپاس

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

    پاسخی بگذارید

    نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *