Uncategorized 

Простой способ красиво показать описание ссылки при наведении / CSS Tooltip

lexx

Это, пожалуй, самый простой способ красиво показывать title ссылки. Причем, все полностью реализовано на CSS.

Добавьте код ниже в ваш CSS файл:


a:hover { background:#ffffff; text-decoration:none;} /*BG color is a must for IE6*/
a.tooltip span {display:none; padding:2px 3px; margin-left:8px; width:130px;}
a.tooltip:hover span{display:inline; position:absolute; background:#ffffff; border:1px solid #cccccc; color:#6c6c6c;}

В нужном месте для ссылки используйте следующую конструкцию:


Это и есть Это крутая ссылка А это супер описание или заголовок, который появляется при наведении на крутую ссылку.

Пример:

Это и есть Это крутая ссылка А это супер описание или заголовок, который появляется при наведении на крутую ссылку.

Это, пожалуй, самый простой способ красиво показывать title ссылки. Причем, все полностью реализовано на CSS.

Добавьте код ниже в ваш CSS файл:

a:hover { background:#ffffff; text-decoration:none;} /*BG color is a must for IE6*/
a.tooltip span {display:none; padding:2px 3px; margin-left:8px; width:130px;}
a.tooltip:hover span{display:inline; position:absolute; background:#ffffff; border:1px solid #cccccc; color:#6c6c6c;}

В нужном месте для ссылки используйте следующую конструкцию:

Это и есть Это крутая ссылка А это супер описание или заголовок, который появляется при наведении на крутую ссылку.

Пример:

Это и есть Это крутая ссылка А это супер описание или заголовок, который появляется при наведении на крутую ссылку.