У меня есть боковая панель навигации в стандартном
шаблоне, который усекает полный текст ссылок с использованием переполнения скрыт. После наведения курсора на 1 секунду я хочу, чтобы якорь расширился по ширине, показывая полный текст ссылки.
У меня эта функция полностью работает в CSS, но я столкнулся с аномалией: У меня ширина привязки установлена на Auto on: hover. После срабатывания задержки в 1 с ширина привязки устанавливается на 0, а затем увеличивается до полной ширины.
ниже мой CSS, и здесь вы можете увидеть мой текущий код в действии: http: // eventfeedstl .com / day / 07182011 /
.day .sidebar{
width: 200px;
}
.day .sidebar ul {
list-style: none;
padding: 0;
margin:0;
position: absolute;
width: auto;
}
.day .sidebar ul li{
border-bottom: 1px solid #626666;
display: relative;
width: 200px;
}
.day .sidebar ul li:hover{
width: auto;
}
.day .sidebar ul li a{
font-weight: normal;
font-size: .8em;
color: #f2f2f2;
display: block;
width: auto;
padding: 4px 5px;
background: none;
width: 190px;
height: 10px;
overflow: hidden;
position: relative;
z-index: 10;
-webkit-transition: background 1.3s ease-out;
-moz-transition: background 1.3s ease-out;
transition: background-color 1.3s ease-out;
}
.day .sidebar ul li a:hover {
background: #797979;
-webkit-transition: background 0.15s;
-moz-transition: background 0.15s;
transition: background 0.15s;
text-decoration: none;
width: auto;
-webkit-transition-property:width;
-webkit-transition-delay:1s;
position: relative;
}