Главная » 2012 Март 16 » Скрипты uCoz: Подсказка для uCoz на CSS3 от 3W_Legenda
19:33 Скрипты uCoz: Подсказка для uCoz на CSS3 от 3W_Legenda | ||||||||||||
Подсказка для uCoz на CSS3 от 3W_LegendaСоветуем посмотреть: src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
Подсказка для uCoz на CSS3 от 3W_Legenda Demo by Nis)kel Это в HTML там где хотим видеть подсказку: Code <!-- 3W_Legenda --> <a href="#" class="cursorhelp blue-cursorhelp">3W_Legenda<!-- <span>Текст Который выводится в подсказка --><span> 3W_Legenda<br /> Подсказка для uCoz </span> <!-- </span> --></a> <!-- / 3W_Legenda --> Это в CSS: Code /* 3W_Legenda 14.05.2011 http://niskel.at.ua/ */ .cursorhelp { position: relative; cursor: help; display: inline-block; text-decoration: none; color: #222; outline: none; } .cursorhelp span { visibility: hidden; position: absolute; bottom: 30px; left: 50%; z-index: 999; width: 230px; margin-left: -127px; padding: 10px; border: 2px solid #ccc; opacity: .9; background-color: #ddd; background-image: -webkit-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0)); background-image: -moz-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0)); background-image: -ms-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0)); background-image: -o-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0)); background-image: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0)); -moz-border-radius: 4px; border-radius: 4px; -moz-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset; -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset; box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.5) inset; text-shadow: 0 1px 0 rgba(255,255,255,.4); } .cursorhelp:hover { border: 0; /* IE6 fix */ } .cursorhelp:hover span { visibility: visible; } .cursorhelp span:before, .cursorhelp span:after { content: ""; position: absolute; z-index: 1000; bottom: -7px; left: 50%; margin-left: -8px; border-top: 8px solid #ddd; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 0; } .cursorhelp span:before { border-top-color: #ccc; bottom: -8px; } /* Color */ .blue-cursorhelp span { border-color: #59add4; background-color: #61bde7; } .blue-cursorhelp span:after { border-top-color: #61bde7; } .blue-cursorhelp span:before { border-top-color: #59add4; } Материал взят с сайта infoscript.ru
|