Adblock breaks this site

Tab hover text?

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

Thread Tools

Thread Tools

  • Thread ID:
  1. sm321

    sm321 Grand Master

    Joined:
    Nov 2, 2011
    Posts:
    2,514
    Referrals:
    1
    Sythe Gold:
    0
    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.
     
    sm321, Apr 30, 2012
    #1
  2. matt_sells

    matt_sells Member

    Joined:
    Nov 28, 2011
    Posts:
    78
    Referrals:
    0
    Sythe Gold:
    0
    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
     
    matt_sells, May 1, 2012
    #2
  3. sm321

    sm321 Grand Master

    Joined:
    Nov 2, 2011
    Posts:
    2,514
    Referrals:
    1
    Sythe Gold:
    0
    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.
     
    sm321, May 1, 2012
    #3
  4. matt_sells

    matt_sells Member

    Joined:
    Nov 28, 2011
    Posts:
    78
    Referrals:
    0
    Sythe Gold:
    0
    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.
     
    matt_sells, May 1, 2012
    #4
  5. sm321

    sm321 Grand Master

    Joined:
    Nov 2, 2011
    Posts:
    2,514
    Referrals:
    1
    Sythe Gold:
    0
    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.
     
    sm321, May 2, 2012
    #5
  6. matt_sells

    matt_sells Member

    Joined:
    Nov 28, 2011
    Posts:
    78
    Referrals:
    0
    Sythe Gold:
    0
    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.
     
    matt_sells, May 2, 2012
    #6
  7. sm321

    sm321 Grand Master

    Joined:
    Nov 2, 2011
    Posts:
    2,514
    Referrals:
    1
    Sythe Gold:
    0
    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 :)
     
    sm321, May 2, 2012
    #7
  8. matt_sells

    matt_sells Member

    Joined:
    Nov 28, 2011
    Posts:
    78
    Referrals:
    0
    Sythe Gold:
    0
    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>
     
    matt_sells, May 2, 2012
    #8
  9. sm321

    sm321 Grand Master

    Joined:
    Nov 2, 2011
    Posts:
    2,514
    Referrals:
    1
    Sythe Gold:
    0
    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 :)
     
    sm321, May 2, 2012
    #9
< Big Website Job | Question >


 
 
Adblock breaks this site