шоу парить по умолчанию с помощью CSS

-4

My JS скрипку здесь: http://jsfiddle.net/n6f5x/шоу парить по умолчанию с помощью CSS

У меня есть следующие CSS:

/* Advanced CSS hover styles */ 
ul.hosplead { overflow: hidden; padding: 5px; } 
ul.hosplead > li { 
    position: relative; 
    float: left; 
    list-style: none; 
    margin: 0 20px 20px 0; 
    font-size: 10px; 
    z-index: 1; 

} 
ul.hosplead li       { text-decoration: none; display: block; } 
ul.hosplead li img      { display: block; position: relative; z-index: -1; } /* IE8 fix, background colour appears behind img for uknown reason set negative z-index */ 
ul.hosplead li:not([class=na]) img  { position: static; } /* Reset relative position, as this plays havoc with good browsers */ 
ul.hosplead li:hover, ul li:focus   { display: block; outline: none; -moz-box-shadow: 3px 3px 5px #000; -webkit-box-shadow: 3px 3px 5px #000; box-shadow: 3px 3px 5px #000; } 
ul.hosplead li:hover img, ul li:focus img { outline: 3px solid #ccc; } 

ul.hosplead li:hover:after, 
ul.hosplead li:focus:after 
{ 
    content: attr(title); 
    color: #000; 
    position: absolute; 
    bottom: 0; 
    height: 30px; 
    line-height: 30px; 
    text-align: center; 
    font-weight: bold; 
    font-size: 12px; 
    width: 100%; 
    background: rgb(255,255,255); 
    background: rgba(255,255,255,0.7); 
    background: -moz-linear-gradient(top, rgba(255,255,255,0.7), rgba(204,204,204,0.7)); /* Firefox 3.6+ */ 
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,0.7)), to(rgba(204,204,204,0.7))); /* Safari */ 
    display: block; 
    text-shadow: 1px 1px 1px #fff; 
}

И следующий HTML:

    <ul class=hosplead> 
         <li title="Pradeep Chandra [CMO]"> 
          <img src="http://4.bp.blogspot.com/_ShYMN0KZ8w4/TUzaT1Z5izI/AAAAAAAAEj4/KRiNd1ossSE/high-quality-wallpapers%5B6%5D.jpg" width="205" title="Pradeep Chandra [CMO]" height="295" alt="Pradeep Chandra [CMO]" /> 
         </li> 
        </ul>

Что я что нужно сделать, это отразить эффект, другими словами, эффект ON HOVER должен быть по умолчанию, когда пользователь посещает страницу. Как я могу это сделать?

источник

2013-05-01 Si8

используйте ': not' селектор, или поменять CSS вокруг. –

Поместите код наведения внутри обычного CSS, а затем обычный CSS внутри раздела hover ... – lifetimes

Не знаете, зачем вам кто-то писать свой CSS для вас, но это так. :-) Как уже намекают другие, это просто вопрос об изменении вещей.

http://jsfiddle.net/isherwood/n6f5x/6/

ul.hosplead li { /* was :hover */ 
    /* no changes */ 
} 
ul.hosplead li:hover { 
    -moz-box-shadow: none; 
    -webkit-box-shadow: none; 
    box-shadow: none; 
} 
ul.hosplead li img { /* was :hover */ 
    /* no changes */ 
} 
ul.hosplead li:hover img { 
    outline: none; 
} 
ul.hosplead li:after { /* was :hover */ 
    /* no changes */ 
} 
ul.hosplead li:hover:after { 
    display: none; 
}

источник

2013-05-01 18:55:12 isherwood

Я написал это, но был немного не уверен в обратном процессе. но спасибо :) – Si8

Снимите селектор hover в CSS DEMO http://jsfiddle.net/n6f5x/2/

li { 
    // no hover selector stated 
}

источник

2013-05-01 18:48:59 Vector

CSS-версия: удалить :hover на ваших стилей: http://jsfiddle.net/kuroisuna/n6f5x/1/

С JQuery вы можете подражать в hover используя .active класс: http://jsfiddle.net/kuroisuna/n6f5x/5/

... удаление класс сверху mouseenter.

источник

2013-05-01 18:53:09

шоу парить по умолчанию с помощью CSS

ответ

Смежные вопросы