ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / событие загрузки js
9 сообщений из 9, страница 1 из 1
событие загрузки js
    #38233796
taaamerlan
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
taaamerlan
Участник
Начну из далека ибо потом мне будут писать - "зачем делать такой бред?".

Я верстаю страницу. Хочу ее сделать полностью резиновой. На фоне лежит изображение, его я не могу пихать в background-image т.к. тогда изображение не будет растягиваться. Изображение я кладу на слой ниже и все получается отлично.
Дошел до ситуации, когда (как мне кажется) без помощи js не обойтись. У меня изображение меняет heigth в зависимости от размера экрана (heigth:100%), а width соответственно меняется в соответствии с соотношением сторон изображения. Затем мне нужно для контейнера лежащего на слой выше сделать такую же ширину. Я писал код

Код: javascript
1.
2.
3.
4.
5.
$('document').ready( function() {
		var iwidth = $('#back').css('width');
		alert(iwidth);
		$('#calc').css('width', iwidth);
	});


в таком случае изображение не успевает загрузиться и мне выводится ширина 0px.
Код: javascript
1.
2.
3.
4.
5.
$('#back').load( function() {
		var iwidth = $(this).css('width');
		alert(iwidth);
		$('#calc').css('width', iwidth);
	});


В таком случае сообщение вообще не выходит т.е. событие не срабатывает. Видимо я чего-то не понимаю в этом событии.

Помогите мне пожалуйста. Какое событие применить в моей ситуации?
...
Рейтинг: 0 / 0
20.04.2013, 13:56
| Ответить | Цитировать | Написать  
событие загрузки js
    #38233836
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
taaamerlanДошел до ситуации, когда (как мне кажется) без помощи js не обойтись.
Это далеко не факт...

Все зависит от требований ко всей странице. А их мы не знаем и верстки самой не видели...
...
Рейтинг: 0 / 0
20.04.2013, 15:03
| Ответить | Цитировать | Написать  
событие загрузки js
    #38233843
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Как вариант...

 
Код: 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.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
<!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;
}
img {
	border: 0;
}
html,
body {
	height: 100%;
}
#body {
	position: relative;
	min-height: 100%;
}
#background {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 3px;
	width: 100%;
	/*height: 100%;*/
	z-index: 1;
}
#background > img{
	width: 100%;
	height: 100%;
}
#content {
	position: relative;
	z-index: 2;
}
</style>
<script type="text/javascript">
</script>
</head>
<body>
<div id='body'>
	<div id='background'>
		<img src='http://cdn.sql.ru/css/images/logo.gif' />
	</div>
	<div id='content'>
		<p>
			Служба Яндекс.Рефераты предназначена для студентов и школьников, 
			дизайнеров и журналистов, создателей научных заявок и отчетов — 
			для всех, кто относится к тексту, как к количеству знаков.
		</p>
		<p>
			Нажав на кнопку «Написать реферат» вы лично создаете уникальный 
			текст, причем именно от вашего нажатия на кнопку зависит, какой 
			именно текст получится — таким образом, авторские права на реферат 
			принадлежат только вам.
		</p>
		<p>
			Теперь никто не сможет обвинить вас в плагиате, ибо каждый текст 
			Яндекс.Рефератов неповторим.
		</p>
		<p>
			Текстами рефератов можно пользоваться совершенно бесплатно, однако 
			при транслировании и предоставлении текстов в массовое пользование 
			ссылка на Яндекс.Рефераты обязательна.
		</p>
		<p>
			А если вы просто искали весну, то вам сюда.
		</p>
	</div>
</div>
</body>
</html>

...
Рейтинг: 0 / 0
20.04.2013, 15:17
| Ответить | Цитировать | Написать  
событие загрузки js
    #38233886
IDVsbruck
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
IDVsbruck
Участник
Я использую похожий подход в проектах:
Код: html
1.
<div class="background"><img src="images/background.jpg"/></div>


Код: css
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
.background {
	height:200%;
	left:-50%;
	position:fixed;
	top:0;
	width:200%;
}
.background img {
	border:none;
	bottom:0;
	left:0;
	margin:0 auto auto;
	min-height:50%;
	min-width:50%;
	position:absolute;
	right:0;
	top:0;
}


Суть его сводится к тому, что а) изображение всегда в центре; б) при изменении пропорций экрана "лишние" части изображения прячутся.
И да, данный div идет первым в body (чтобы не добавлять z-index).
...
Рейтинг: 0 / 0
20.04.2013, 16:37
| Ответить | Цитировать | Написать  
событие загрузки js
    #38233974
taaamerlan
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
taaamerlan
Участник
Если я что-то понял, то в обоих кодах изображение растягивается по вертикали и все хорошо и легко. В моем случае изображение растягивается по горизонтали, а контейнер с содержимым должен иметь ширину этого изображения, которая динамическая.

Кстати, что значит
#background > omg я вообще не понял.

Либо вы не поняли чего я хочу, либо мне требуется ликбез
...
Рейтинг: 0 / 0
20.04.2013, 19:41
| Ответить | Цитировать | Написать  
событие загрузки js
    #38234080
IDVsbruck
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
IDVsbruck
Участник
Ты ошибаешься. Попробуй и вопросы отпадут.
...
Рейтинг: 0 / 0
20.04.2013, 23:42
| Ответить | Цитировать | Написать  
событие загрузки js
    #38234201
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
taaamerlanЕсли я что-то понял, то в обоих кодах изображение растягивается по вертикали и все хорошо и легко. В моем случае изображение растягивается по горизонтали, а контейнер с содержимым должен иметь ширину этого изображения, которая динамическая.
Ты вообще пример-то запускал?

taaamerlanКстати, что значит
#background > omg я вообще не понял.
Ты его даже скопировал с ошибкой...

taaamerlanлибо мне требуется ликбез
В буквари однозначно!
...
Рейтинг: 0 / 0
21.04.2013, 12:55
| Ответить | Цитировать | Написать  
событие загрузки js
    #38234349
taaamerlan
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
taaamerlan
Участник
krvsa,

не имел возможности запустить код. А в ошибке не вижу нечего смешного. Я заходил со смартфона, а он не хотел копировать код
...
Рейтинг: 0 / 0
21.04.2013, 19:17
| Ответить | Цитировать | Написать  
событие загрузки js
    #38234364
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
taaamerlan , но "оценку" свою таки вынес...
...
Рейтинг: 0 / 0
21.04.2013, 19:47
| Ответить | Цитировать | Написать  
9 сообщений из 9, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / событие загрузки js
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&gotonew=1&tid=1448423]:
 0ms
get settings:
 11ms
get forum list:
 18ms
check forum access:
 4ms
check topic access:
 4ms
track hit:
 33ms
get topic data:
 11ms
get first new msg:
 8ms
get forum data:
 3ms
get page messages:
 59ms
get tp. blocked users:
 2ms
others: 236ms
total:  389ms
созд. / загр.: 389ms
x
x
Закрыть


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