Pridėti Margin Hover tekstą į bet kurias svetaines lengvai su Marginotes

Įterpti įrankių patarimus yra fantastiški, tačiau kartais jie tiesiog netinka tam tikram turiniui. Dauguma svetainių palieka erdvę palei puslapio korpusą ir tai puikiai tinka pridėti įrankių stiliaus turinys be įrankių patarimų.

Įveskite Marginotes, nemokamą atviro kodo jQuery įskiepį prideda priskirtas pastabas prie paraščių savo tinklalapio. Šias pastabas galite perjungti pagal nuorodas ar tam tikrus puslapio elementus, pvz., Vaizdus.

Šis įskiepis yra neįtikėtinai lengva nustatyti ir jis yra su numatytasis stilių lapas už maržos užrašus. Jie rodomi į šoną jūsų turinio ir jie suderinami tiesiai prie pastraipos elemento jūsų tinklalapyje.

Hover pastabos yra pridėta rankiniu būdu prie HTML elementų, naudojant a desc atributas. Aš niekada nemačiau to HTML5, todėl negaliu pasakyti, ar tai visiškai atitinka. Bet, ji gauna įlaipinami JavaScript, kuri yra viskas, ko jums tikrai reikia.

Tu taip pat gali pakeisti šį atributą kai paleisite marginotes () funkciją, kad galėtumėte pakeisti jį į kažką panašaus duomenų-desc jei norite būti labiau suderinti.

Čia yra viena „JQuery“ linija reikia norint gauti šį papildinį:

 $ („selektorius“). marginotes () 

Turėtumėte pakeisti „selektorius“ su bet kokiais taikomais elementais. Taigi, jei jie yra jūsų puslapio korpuse, galite naudoti ".body span". Jūs taip pat galėtumėte tikslinės inkaro nuorodos arba pagal tam tikras klases prie šių elementų.

Viduje marginotes () funkcija, galite pridėti du neprivalomi parametrai pakeisti paraštės pastabos formatą:

1. plotis - nustato užrašo plotį (numatytoji reikšmė yra 100px)
2. lauke - nustato HTML turinio atributą (pagal nutylėjimą „desc“)

Be to, jei jums nepatinka naudoti jQuery, galite pabandyti vanilės Marginotes įskiepis. Jis veikia ant vanilės JS, taigi turite nulinės priklausomybės gauti visas tas pačias funkcijas.

Taip pat galite tai patikrinti gyva demonstracija jei norite matyti jį veikiant. Tai tikrai unikalus įskiepis ir tai puikus būdas pridėkite papildomą turinį į jūsų svetainę.