Menu
I don't want to repeat alt text in title again? is this possible with any javascript , jquery, css solution? or any solution which can disable to show alt=text and enable title=texr and as a tooltip?
366
The text that appears when you hover on an image with your mouse is the “title tag” (or tool tip). The alt text for an image, however, is shown when the image cannot be displayed. For example, visually impaired users will have the alt text read to them to describe the image.
There are two ways you can create a hover text for your HTML elements: Adding the global title attribute for your HTML tags. Creating a tooltip CSS effect using :before selector.
Chrome™ browser: point to the image with your mouse, right-click and choose Inspect from the quick menu (or use Ctrl-Shift-I on keyboard). A new pane will open at the right of your screen with the HTML code highlighted for that element. You can then view the alt text and other attributes for the image.
HTML: Use a container element (like <div>) and add the "tooltip" class to it. When the user mouse over this <div>, it will show the tooltip text. The tooltip text is placed inside an inline element (like <span>) with class="tooltiptext" .
The correct way to do this is to use the title attribute.
e.g.
<div title="This is your tooltip">...content...</div>
The "alt" attribute is only designed to provide "alternative" text when an image element is used (but not available to the user... e.g. blind users, or users with text-based browsers etc.)
69
alt text is for an alternative representation of an image. title text is for tooltips.
IE's behavior is incorrect in this regard, and Firefox will never implement it. (The bug in the Bugzilla database is #25537, which is VERIFIED WONTFIX.)
Not only that, but even Microsoft has admitted that their behavior is incorrect, and IE 8 doesn't show alt text as tooltips anymore!.
So don't rely on alt text being displayed as a tooltip. Use title instead.
45
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
