WordPress.org

Ready to get started?Download WordPress

Forums

Text Preview (5 posts)

  1. Fundamental Charlie
    Member
    Posted 3 years ago #

    Right now I have a page with a list of all the articles I have posted on my blog, The Fundamental Blog. I want to find a way to open an individual text balloon so that when the visitor mouses over the title, (which is in itself an active link), a topical preview of text opens. This would allow me to give a little explanation of what the post is about as the titles are sometimes a bit obscure. I don't know if I am looking for a plug-in or what...HELP!!!

  2. Marventus
    Member
    Posted 3 years ago #

    Hi Charlie,
    You don't really need a plugin for that. If what you're looking for is not very fancy-shmancy, you can do it with the 'title' html tag.
    Here's the code you need to use (taking your first link "God is..." as an example):
    <a href="http://www.thefundamentalist.info/?p=198" Title="A post/blog about the essence of God">God is...</a>
    And here's a working version of the example:
    God is...

    If you are looking for something "prettier," the only tool I know is dramatically more complicated to use, and it requires a decent to intermediate understanding of JQuery (JavaScript): it is called Jtip and it was developed by Cody Lindley, but I do not know if it works with WP.

    Good luck!

  3. FishDogFish
    Member
    Posted 3 years ago #

    If you want multi-line tool tips you can do this....

    In the CSS

    a.tooltip:hover span{display:inline; position:absolute; border:2px solid black;background:whitesmoke; color:green;}
    
    a.tooltip:hover{text-decoration:none;}
    
    a.tooltip span{display:none; padding:2px 3px; margin-left:8px; width:200px;}

    In the HTML

    <a class="tooltip" href="http://emptylink.com/">Link Text<span>This is a CSS tool tip<br> It's multi-line for clarity<br> Clarity is important in tool tips</span></a>
    `

  4. Marventus
    Member
    Posted 3 years ago #

    Hi FishDogFish,

    That's a great solution as well. For some reason it didn't even occur to me to do it through CSS: I guess two heads think better than one! :-)

  5. FishDogFish
    Member
    Posted 3 years ago #

    You didn't think of it, so my head thinks better than yours.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.