Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Помогите сделать затемнение / 7 сообщений из 7, страница 1 из 1
27.02.2014, 13:33
    #38574096
__Avenger__
__Avenger__
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Помогите сделать затемнение
Добрый день!

Мне необходимо сделать блок по центру которого будет картинка и снизу текст. Изначально блок немного затемнен. При наведении мыши блок целиком подсвечивается.

Здесь как пробовал. В первом варианте текст не снизу, картинка не по центру. И выделяется блок неполностью. Во втором варианте, текст не снизу, картинка вообще уехала. Зато с выделением все ок.

Подскажите, что мне необходимо подправить?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.02.2014, 13:58
    #38574136
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Помогите сделать затемнение
__Avenger__ДИзначально блок немного затемнен. При наведении мыши блок целиком подсвечивается.
Как вариант...

Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
<!DOCTYPE html>
<html>
<head>
<!--
<script src='http://code.jquery.com/jquery-latest.js'></script>
<link rel='stylesheet type=text/css href=tmp.css' />
-->
<style type='text/css'>
* {
	margin: 0;
	padding: 0;
}
#box {
	position: relative;
	margin: 20px;
	border: 1px solid;
}
#box_fon {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #000000;
	opacity: 0.2;
	filter: alpha(opacity=20);
}
#box:hover #box_fon {
	background-color: transparent;
}
</style>
<script type='text/javascript'>
</script>
</head>
<body>
<div id='box'>
	<div id='box_fon'></div>
	<p>
		Служба Яндекс.Рефераты предназначена для студентов и школьников, 
		дизайнеров и журналистов, создателей научных заявок и отчетов — 
		для всех, кто относится к тексту, как к количеству знаков.
	</p>
	<p>
		Нажав на кнопку «Написать реферат» вы лично создаете уникальный 
		текст, причем именно от вашего нажатия на кнопку зависит, какой 
		именно текст получится — таким образом, авторские права на 
		реферат принадлежат только вам.
	</p>
</div>
</body>
</html>
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.02.2014, 18:06
    #38574569
Програмёр
Програмёр
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Помогите сделать затемнение
__Avenger__Добрый день!

Мне необходимо сделать блок по центру которого будет картинка и снизу текст. Изначально блок немного затемнен. При наведении мыши блок целиком подсвечивается.

Здесь как пробовал. В первом варианте текст не снизу, картинка не по центру. И выделяется блок неполностью. Во втором варианте, текст не снизу, картинка вообще уехала. Зато с выделением все ок.

Подскажите, что мне необходимо подправить?

В написанном Вами вижу всё в точности наоборот к описанию :) Блок затемняется при наведении. По центру не картинка, а текст... И катринка выходит за пределы блока. Причём это с крутыми багами :)
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.02.2014, 22:55
    #38574803
__Avenger__
__Avenger__
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Помогите сделать затемнение
Програмёр,

Код: sql
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
<!doctype html>
<html>
<head>
<meta charset="win1251">
<title>Документ без названия</title>
<style type="text/css">
a img {
border: none;
}
ul.plBanners {
	list-style: none;	
	list-style-image: none;	
}
.plBanners li {
	margin: 10px;
	padding: 10px;
	width: 200px;
	float: left;
}
.plBanners li a {
	text-align: center;
	display: block;
	opacity: 0.8;
	filter: alpha(opacity=80);
}
.plBanners li a:hover {
	color: black;
	opacity: 1;
	filter: alpha(opacity=100);
}

</style>
</head>

<body>
<table width="60%" border="1">
  <tr>
    <td><div class="projects">
          



          
                            <ul class="plBanners">
                <li><a href="http://ya.ru" target="_blank">
                  <img src="http://im0-tub-ru.yandex.net/i?id=379304044-49-72" width="96" height="101" alt=""/>
                                    <span>aaaaaaaaaaaaaaaaaaa</span>

               </a></li>
                <li><a href="http://ya.ru" target="_blank">
                  <span>bbbbbbbbbbbbbbbbb</span>
                  <img src="http://im0-tub-ru.yandex.net/i?id=379304044-49-72" width="96" height="101" alt=""/></a></li>
              </ul>
            </div>
            
            
            
            
            </td>
  </tr>
</table>

</body>
</html>



Я хотел, что бы существующий блок (элемент li) при наведении мышки затемнялся этим фоном. Как сделать это - пока не понял.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.02.2014, 22:57
    #38574804
__Avenger__
__Avenger__
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Помогите сделать затемнение
Ссылка
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.02.2014, 23:01
    #38574807
__Avenger__
__Avenger__
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Помогите сделать затемнение
Примерно так , но должна еще и картинка затемняться.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.02.2014, 23:07
    #38574810
__Avenger__
__Avenger__
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Помогите сделать затемнение
Хочется такого , но с моими li блоками.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Помогите сделать затемнение / 7 сообщений из 7, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение  
Полит. конфиден.  
созд. / загр.: 612ms
Закрыть
start [/forum/topic.php?fid=22&mobile=1&tid=1447366]:
 0ms
get settings:
 8ms
get forum list:
 16ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 326ms
get topic data:
 9ms
get forum data:
 3ms
get page messages:
 39ms
get tp. blocked users:
 1ms
others: 204ms
total:  612ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]