Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 23.12.2016, 19:35
Новичок на форуме
Отправить личное сообщение для Invert Посмотреть профиль Найти все сообщения от Invert
 
Регистрация: 23.12.2016
Сообщений: 1

Проблема с hover
Здравствуйте, я решил сделать сайт по шаблону от wix.com, я только учусь, вот не могу понять как сделать так что бы блок с картинкой заливался желтым с opacity 0.6 где-то и в то же время что бы эта картинка была ссылкой на саму себя но в окне галереи от fancybox.
У меня заливка желтым уже стоит через hover, но картинка не работает как ссылка, если я убираю hover то ссылка становится активной и галлерея работает как задумано.
Вот ссылка на шаблон сайта:
http://ru.wix.com/website-template/view/html/1642?originUrl=http%3A%2F%2Fru.wix.com%2Fwebsite%2 Ftemplates%2Fhtml%2Fall%2F2&bookName=&galleryDocIn dex=7&category=all

Вкладка "О нас", внизу есть фото команды, они при наведении на них мышкой заливаются желтым, а блок с текстом нет, у меня это работает, но не работает ссылка в картинке на галерею как в оригинальном шаблоне.

Вот код HTML:
<tr>
<td id ="td1">
<div id="line1block7">
<div class="im">	<a class="gallery" rel="group" href="images/com_1big.jpg" width="240px" height="198px">		<img src="images/com_1.jpg" width="240px" height="198px">	</a></div>
<span class="emp1">Юлия Соколова</span><span class="empinfo1"><p class="text1">Руководитель студии<br><br>Это текст. Кликните дважды, чтобы отредактировать его. Расскажите посетителям сайта о себе, своих услугах и преимуществах.</p></span>
</td>
</div>


Вот код CSS:

Код:
.im{
	width: 240px;
	height: 198px;
	margin-bottom: 5px;
	border: none;
	position: relative;
}
.im:hover{
    transition:all .5s;
    background: yellow;
    content: " ";
    opacity: 0;
    position: absolute;
    top:0; bottom: 0; left: 0; right: 0;
}
div:hover .im:after{
    opacity: .6;
}
.emp1, .empinfo1{
	padding-left: 10px;
}
.emp1{
	font-family: play, sans-serif;
	margin-top: 5px;
	padding-top: 15px;
	background-color: #CFCFCF;
	display: block;
	position: absolute;
	width: 230.2px;
	height: 29px;
	color: #FFFFFF;
	font-size: 19px;
}
Помогите пожалуйста разобраться, а то я буду ещё недели две сидеть над этим пунктом.
Ответить с цитированием
  #2 (permalink)  
Старый 30.12.2016, 09:51
Новичок на форуме
Отправить личное сообщение для dkv01 Посмотреть профиль Найти все сообщения от dkv01
 
Регистрация: 27.12.2016
Сообщений: 9

div:hover .im:after{
opacity: .6; <=== .6 так и должно быть ?
}
Ответить с цитированием
  #3 (permalink)  
Старый 30.12.2016, 09:58
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от dkv01
так и должно быть ?
ноль перед точкой указывать необязательно
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Проблема с изменение цвета (:hover) после клика. versancho Общие вопросы Javascript 2 23.04.2016 23:35
проблема с window.getComputedStyle Gooody29 Events/DOM/Window 2 10.03.2016 13:45
Проблема с hover Vadim7423 jQuery 2 17.02.2015 10:58
Проблема с hover Ingiborn jQuery 8 10.07.2014 17:14
Установка цвета через функцию .css() сбрасывает цвет для :hover xintrea jQuery 4 18.08.2012 15:38