Beranda » Toolkit » Tambahkan Margin Hover Teks ke Situs Web Apa pun dengan Mudah dengan Marginotes

    Tambahkan Margin Hover Teks ke Situs Web Apa pun dengan Mudah dengan Marginotes

    Tip tool sebaris fantastis tetapi kadang-kadang mereka tidak cocok dengan konten tertentu. Sebagian besar situs web menyisakan ruang di margin di sepanjang badan halaman dan ini sempurna untuk ditambahkan konten tooltip-style tanpa tooltips.

    Memasukkan Marginote, plugin jQuery open source gratis itu menambahkan catatan khusus ke margin dari halaman web Anda. Anda dapat beralih catatan ini berdasarkan tautan atau elemen tertentu pada halaman, seperti gambar.

    Plugin ini secara mengejutkan mudah diatur dan dilengkapi dengan stylesheet standar untuk catatan margin Anda. Ini muncul ke samping konten Anda dan mereka menyelaraskan tepat di sebelah elemen paragraf di halaman web Anda.

    Catatan melayang adalah ditambahkan secara manual ke elemen HTML Anda, menggunakan sebuah desc atribut. Saya belum pernah melihat ini di HTML5 jadi saya tidak bisa mengatakan apakah itu sepenuhnya sesuai. Tapi, itu diambil oleh JavaScript yang benar-benar Anda butuhkan.

    Anda juga bisa ubah atribut ini ketika Anda menjalankan margotes () berfungsi, jadi Anda bisa mengubahnya menjadi sesuatu seperti data-desc jika Anda ingin lebih patuh.

    Inilah satu baris jQuery diperlukan agar plugin ini berfungsi:

     $ ("selector"). margotes () 

    Anda harus mengganti "pemilih" dengan elemen apa pun yang Anda targetkan. Jadi, jika mereka ada di dalam tubuh halaman Anda, Anda mungkin menggunakan ".bentang tubuh". Anda juga bisa target jangkar tautan atau oleh kelas-kelas tertentu ditambahkan ke elemen-elemen ini.

    Di dalam margotes () fungsi, Anda dapat menambahkan dua parameter opsional untuk mengubah format catatan tepi:

    1. lebar - mengatur lebar nada (default ke 100px)
    2. bidang - mengatur atribut konten HTML (default ke "desc")

    Juga, jika Anda tidak suka menggunakan jQuery, Anda dapat mencoba Plugin vanilla Marginotes. Ini berjalan pada vanilla JS, jadi sudah nol ketergantungan untuk mendapatkan semua fitur yang sama.

    Anda juga dapat melihat ini demo langsung jika Anda ingin melihatnya beraksi. Ini jelas merupakan plugin yang unik dan ini cara yang bagus untuk melakukannya tambahkan beberapa konten tambahan ke situs Anda.