مردان وردپرس آموزش بوت استرپ آموزش بوت استرپ ، پاپ اور ( Popover )
آموزش بوت استرپ ، پاپ اور ( Popover )

پاپ اور Popover در بوت استرپ، همانند تولتیپ tooltip عمل می کند. به این صورت که با کلیک روی المان مورد نظر، یک tooltip در کنار آن، نشان داده می شود. که با توجه به نوع تولتیپ، می تواند در هر چهار طرف المان قرار بگیرد.

برای این کار، ابتدا باید آن را فعال کنیم:

اکنون، پس از فعالسازی، با کد زیر، می توانی یک Popover داشته باشیم:

با استفاده از دستورات زیر، می توان popover در در اطراف المان تعیین کرد:

 

Popover با قابلیت بسته شدن

با استفاده از این کد، می توانیم با کلیک بر روی المان، popover را ببندیم:

با استفاده از دستور زیر و استفاده از کلاس .sticky می توان بر روی صفحه، المانی به عنوان یک استیکی نوت داشته باشم:

تولتیپ در بوتسرپ

تفاوت بین تولتیپ و پاپ اور، در این است که در popover حتما باید روی المان مورد نظر، کلیک شود تا فعال شود. اما برای tooltip فقط کافیست Mouse Over شود. برای فعالسازی تولتیپ، ابتدا کد زییر در برنامه جایگذاری می کنیم:

همچنین با استفاده از کدهای زیر، می توان تولتیپ در موقعیت های مختلف المان (بالا، پایین، چپ و راست) استفاده کرد:

 

تاریخ آخرین بروزرسانی : ۲۴ آبان ۱۳۹۶
منبع :‌ مردان وردپرس
سجاد رحمانی نژاد

کارشناس طراحی UI وب ، بیش از سه سال سابقه طراحی و کار اجرایی در سازمان های مختلف و به صورت مستقل ( Freelance ) همچنین مدرس دوره های طراحی وب در آموزشگاه های تهران و کرج.

Advertising MiSaCo.

نظرات خود را اینجا بنویسید

آدرس الکترونیکی شما نمایش داده نمی شود *

Time limit is exhausted. Please reload CAPTCHA.