Tab hover text?

Discussion in 'Web Programming' started by sm321, Apr 30, 2012.

Tab hover text?
  1. Unread #1 - Apr 30, 2012 at 3:31 PM
  2. sm321
    Joined:
    Nov 2, 2011
    Posts:
    2,514
    Referrals:
    1
    Sythe Gold:
    0

    sm321 Grand Master

    Tab hover text?

    This has been posted here too (near the end) http://villavu.com/forum/showthread.php?t=80480.

    Hello :) I'm learning HTML and CSS, and I know how to do:


    Code:
    <title>Sythe Example</title>
    But if I hover over a tab like this:

    [​IMG]

    It has some text similar to the:

    Code:
    <img src="imgsource.here" [COLOR="Lime"]title="This part">[/COLOR]
    (I do know I have missed some text ^, but it was only an example)

    Does anyone know how to make the text appear when you hover over it?

    Thankyou.
     
  3. Unread #2 - May 1, 2012 at 6:53 AM
  4. matt_sells
    Joined:
    Nov 28, 2011
    Posts:
    78
    Referrals:
    0
    Sythe Gold:
    0

    matt_sells Member

    Tab hover text?

    The idea of text is to explain itself however you can do what you've asked <abbr title="sythe is a online forum">sythe</abbr> like so also you can add <p title=""></p> etc
     
  5. Unread #3 - May 1, 2012 at 12:25 PM
  6. sm321
    Joined:
    Nov 2, 2011
    Posts:
    2,514
    Referrals:
    1
    Sythe Gold:
    0

    sm321 Grand Master

    Tab hover text?

    Thankyou for the reply :) I've sort of got it, but when I can either have it not working at all, or have it working but the wrong text o_O Can you show me an example using the
    Code:
     tags please? :) Here's what works:
    
    [CODE]<title><abbr title="Title">Practice Site - Home</title>
    But that ^ shows the hover text <title><abbr title="Title">Practice Site - Home, when it should show the word title.
     
  7. Unread #4 - May 1, 2012 at 4:39 PM
  8. matt_sells
    Joined:
    Nov 28, 2011
    Posts:
    78
    Referrals:
    0
    Sythe Gold:
    0

    matt_sells Member

    Tab hover text?

    the <title> tag sets the title of the page so

    Code:
    <head><title> this is my page</title></head>
    that will give your page the title of "this is my page". It doesn't put anything on the page just a title for the page, it's for your users and most importantly google and other search engines. For an actual page title you can use lots of different things, <p><h1>, etc etc
    Code:
    <p class="page-title" title="this is my title">this is my title</p>
    that will give you some text that will allow you to hover over and a tooltip to pop up with the text within the title="" bit.

    I am slightly confused as to what you want, but I think you want the second example.
     
  9. Unread #5 - May 2, 2012 at 3:53 AM
  10. sm321
    Joined:
    Nov 2, 2011
    Posts:
    2,514
    Referrals:
    1
    Sythe Gold:
    0

    sm321 Grand Master

    Tab hover text?

    Thankyou for the reply :) Do I have to add anything in my CSS sheet, or just straight into the HTML one? Aswell, I'm using the
    Code:
    <p class="page-title" title="this is my title">this is my title</p>
    but it still doesn't work :( I think I'm doing a school boy error of some sort somewhere.
     
  11. Unread #6 - May 2, 2012 at 6:48 AM
  12. matt_sells
    Joined:
    Nov 28, 2011
    Posts:
    78
    Referrals:
    0
    Sythe Gold:
    0

    matt_sells Member

    Tab hover text?


    Code:
    <p class="page-title" title="this is my title">this is my title</p>
    when you hover over that text, it should pop up with a tooltip saying this is my title, literally copy and paste it, nothing wrong with the code.

    As for the css, I put that in just to show you that you can style it. You obviously want your readers to take the time to hover over so you could make it bigger+change the colour to make it stand out.

    I'll add a page to a website as an example if you like.
     
  13. Unread #7 - May 2, 2012 at 6:58 AM
  14. sm321
    Joined:
    Nov 2, 2011
    Posts:
    2,514
    Referrals:
    1
    Sythe Gold:
    0

    sm321 Grand Master

    Tab hover text?

    Ok, I've gotten somewhere now:

    [​IMG]

    But I would like that tool tip to appear when you hover over the tab. Thankyou for all your help so far :)
     
  15. Unread #8 - May 2, 2012 at 7:28 AM
  16. matt_sells
    Joined:
    Nov 28, 2011
    Posts:
    78
    Referrals:
    0
    Sythe Gold:
    0

    matt_sells Member

    Tab hover text?

    lol, so you do mean you want it to pop up when you hover over a webpages title like this one is tab hover text? sythe.org blah blah because that should happen naturally <title>tab hover text? - sythe.org blah blah</title>
     
  17. Unread #9 - May 2, 2012 at 7:34 AM
  18. sm321
    Joined:
    Nov 2, 2011
    Posts:
    2,514
    Referrals:
    1
    Sythe Gold:
    0

    sm321 Grand Master

    Tab hover text?

    Oh... maybe it was because it wasn't actually online (on a server), I just opened the webpage. But the thing you taught me will come in handy, thankyou :)
     
< Big Website Job | Question >

Users viewing this thread
1 guest


 
 
Adblock breaks this site