Kesar Sisodiya
Kesar Sisodiya

Reputation: 1624

increase size of title text on mouse hover

I want increase title tag size on mouse hover which is in anchor tag. so how can target to title.

<a href="#pop-up-form" rel="wp-video-lightbox" title="Nous contacter" class="a">kesar sisodiya</a>

Upvotes: 1

Views: 3162

Answers (4)

MKhalid
MKhalid

Reputation: 1

check this, hope it helps you


    a {
      color: #000;
      text-decoration: none;
    }


    a:hover {
      color: green;
      position: relative;
    }


    a[title]:hover:after {
      content: attr(title);
      padding: 4px 8px;
      color: #000;
      position: absolute;
      left: 0;
      top: 100%;
      white-space: nowrap;
      z-index: 20px;
      -moz-border-radius: 5px;
      -webkit-border-radius: 5px;
      border-radius: 5px;
      background:#ccc;

    }

Upvotes: 0

RKS
RKS

Reputation: 1410

You can't increase the size of title property.

You can try using the tooltip provided by jQuery. jQuery Tooltip example

Upvotes: 1

tywalker
tywalker

Reputation: 78

You could use a div that displayed when you hover over your text.

<div class="custom_title_tag">This is the title</div>

then style it with css

a:hover .custom_title_tag {
    background:black;
    opacity: 1.0;
}

The first answer was pretty straightforward though. But you could just position it relative to the link title you want to show.

Upvotes: 0

Node Bot
Node Bot

Reputation: 41

The title text is handled by the browser and is not made available to us. You could make your own title text handler with JavaScript, but I don't think that's a very good solution.

Upvotes: 1

Related Questions