Сергей777555
New Member
- Регистрация
- 16.01.2015
- Сообщения
- 6
Сайт на Ucoz но нужна помощь в вёрстке (запутался)
Привет всем ! При наведении на шапку сайта (картинку) появляется сепия, через hover. На картинке поверх закреплено два блока Div(поиск и регистрация) Помогите сделать что-бы при наведении на картинку появлялась сепия и текст.
Это верхняя часть сайта HTML
<div class="image2">
<div class="image"><div class="sepia"><img src="/av2015.jpg" alt="" width="1075" height="283" style="font-size: 8pt;"></div>
<h2><span style="color: rgb(255, 255, 255);">
<div style="text-align: center;"><span style="font-size: 10pt; font-family: Arial;">$LOGIN_FORM$ </span>
<?if($USERS_ON$)?><?if($USER_LOGGED_IN$)?><!--<s5200>--><!--</s>--> <a href="$PERSONAL_PAGE_LINK$"><b>$USERNAME$</b></a> <!--<s3167>--><?else?><!--<s5212>--><!--</s>--> <b>$USERNAME$</b><?else?> | <a href="$REGISTER_LINK$" title="Регистрация"><!--<s3089>-->Регистрация<!--</s>--></a><?endif?><?endif?> <?if($USERS_ON$)?><?if($USER_LOGGED_IN$)?> | <a href="$LOGOUT_LINK$" title="Выход"><!--<s5164>-->Выход<!--</s>--></a><?else?> | <a href="$LOGIN_LINK$" title="Вход"><!--<s3087>-->Вход<!--</s>--></a><?endif?><?endif?>
</div></span><br /></a></h2>
<h3>$MYINF_36$</h3>
</div>
</div></a></div>это css сепии
.sepia img {
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
.sepia img:hover {
-webkit-filter: sepia(100%);
}Это css блоков поиска и регистрации
Привет всем ! При наведении на шапку сайта (картинку) появляется сепия, через hover. На картинке поверх закреплено два блока Div(поиск и регистрация) Помогите сделать что-бы при наведении на картинку появлялась сепия и текст.
Это верхняя часть сайта HTML
<div class="image2">
<div class="image"><div class="sepia"><img src="/av2015.jpg" alt="" width="1075" height="283" style="font-size: 8pt;"></div>
<h2><span style="color: rgb(255, 255, 255);">
<div style="text-align: center;"><span style="font-size: 10pt; font-family: Arial;">$LOGIN_FORM$ </span>
<?if($USERS_ON$)?><?if($USER_LOGGED_IN$)?><!--<s5200>--><!--</s>--> <a href="$PERSONAL_PAGE_LINK$"><b>$USERNAME$</b></a> <!--<s3167>--><?else?><!--<s5212>--><!--</s>--> <b>$USERNAME$</b><?else?> | <a href="$REGISTER_LINK$" title="Регистрация"><!--<s3089>-->Регистрация<!--</s>--></a><?endif?><?endif?> <?if($USERS_ON$)?><?if($USER_LOGGED_IN$)?> | <a href="$LOGOUT_LINK$" title="Выход"><!--<s5164>-->Выход<!--</s>--></a><?else?> | <a href="$LOGIN_LINK$" title="Вход"><!--<s3087>-->Вход<!--</s>--></a><?endif?><?endif?>
</div></span><br /></a></h2>
<h3>$MYINF_36$</h3>
</div>
</div></a></div>это css сепии
.sepia img {
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
.sepia img:hover {
-webkit-filter: sepia(100%);
}Это css блоков поиска и регистрации
Код:
.image {
position : relative;
width : 100%; /* for IE 6 */
}
.image2 {
position : relative;
width : 100%; /* for IE 6 */
}
h2 {
position : absolute;
top : -10px;
left : 855;
width : 20%;
font-size: 12px;
opacity: 0.7;
background: #E7EEF8; background: linear-gradient(to top, #E7EEF8, #C2E0FF); /* Цвет фона */
padding: 0px;
border: 1px solid #fff;
border-radius: 0 0 10px 10px;;
}
h3 {
position : absolute;
top : -14px;
left : 2;
width : 30%;
}