ثبت نام

امکان عضویت غیر فعال است

کار با Tooltip ها در بوت استرپ

how use Tooltip in Bootstrap
ب

کار با Tooltip ها در بوت استرپ

سلام خدمت تموم کاربران عزیز پاتوق وردپرس

بوتسترپ یک فریمورک حرفه ای برای راحتی کار ما در طراحی وب میباشد و از ان در طراحی انواع وب سایت میتوان استفاده کرد.اگر از بیستر طراحان سوال کنید میگویند فقط از بوت استرپ برای طراحی واکنش گرا استفاده میشد.در حالی که این فریمورک دارای امکانات فوق العاده زیاد میباشد که یکی از این موارد استفاده تولتیپ ها میباشند که خیلی به زیبایی کار در طراحی قالب می افزایند و البته کار کردن با انها در فریمورک بوتسترپ فوق العاده اسان میباشد.

نحوه ساخت تولتیپ در بوت استرپ

برای ساختن یک تولتیپ در بوتسترپ کافی است یک  "data-toggle="tooltip   را به المان مورد نظر بدهیم که به شکل زیر میباشد.

چند نکته ای که باید توجه داشته باشید در حین استفاده از این تولتیپ ها:

  1. نکته ی اول این است که متن نمایش داده شده در تولتیپ از روی عنوان یا title را نمایش می دهد پس بنابراین باید المان ما درارای title باشید.
  2. برای استفاده ار تولتیپ ا باید یک کد jquery به منظور مقدار دهی اولیه و فعال سازی تولتیپ در فوتر سایت شما قرار دهید.کد زیر رادر انتهای فایل footer و قبل از بسته شدن </body> قرار بگیرد.

مکان قرار گیری تولتیپ در بوت استرپ

اما یک قابلیتی که در بوت استرپ قرار گرفته است این است که شما میتوانید موقعیت قرار گری اینتولتیپ را به راحتی مشخص کنید و کافی از کد

data-placement="right or left or bottom or top"  که باید مقدار را هر کدام که نیاز دارید قرار بدهید.

در نهایت ما کدی کامل مشابه زیر خواهیم داشت.

 

 

به این پست امتیاز دهید.
امتیاز خود را ثبت کنید

ارسال دیدگاه

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