VPF::трабл с background у div. - Форум программистов

archy

Дата 22.4.2008, 11:55 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 9
Регистрация: 22.4.2008

Репутация: нет
Всего: нет

Насколько я понял, стандартными возможностями хтмля не решить, может, возможно это реализовать на джскрипте? Репост из хтмл-ветки.
Тут вот понадобилось сделать такую штуку, а не знаю как ...
Есть картинка большого размера, скажем 3000х2000пх. Есть хтмл-файл с единственным дивом. Он растянут на 100% по высоте и ширине. Разрешение моего экрана, скажем 1280х1024. Требуется кинуть на бэкграунд дива данную картинку (с этим понятноsmile), причем чтобы по меньшей стороне он вписался аккурат в див, то есть высота картинки стала = высоте дива (в моем случае - 1024пх за вычетом). Соответственно пропорционально должна измениться и ширина. Как это сделать - не понятно. Добился только того, чтобы картинка ресайзилась под размер самого дива и соотв. размер самого окна. При непропорциональном изменении размера окна получается хрень, а надо чтобы выглядело более-менее удобоваримо. Кто что предложит?) Заранее спасибо.

LSD

Дата 22.4.2008, 12:06 (ссылка)

(нет голосов)

Загрузка ...

Leprechaun Software Developer

Профиль
Группа: Модератор
Сообщений: 15718
Регистрация: 24.3.2004
Где: Dublin

Репутация: нет
Всего: 538

Модератор: перемещено из Java.

--------------------

Disclaimer: this post contains explicit depictions of personal opinion. So, if it sounds sarcastic, don't take it seriously. If it sounds dangerous, do not try this at home or at all. And if it offends you, just don't read it.

bars80080

Дата 22.4.2008, 12:28 (ссылка)

(нет голосов)

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 44
Всего: 315

я же тебе написал javascript, а не java

вот примерно так:

Код

<html><head>
<style>
* { margin: 0px; padding: 0px; }
#page { position: absolute; top: 0px; left: 0px; width: 100%; }
</style>
<script>
var fon = new Image();
fon.src = 'zzz.jpg';
function resizing() {
    var timg = document.getElementById('imgfon');
    y = document.body.clientHeight;
    x = document.body.clientWidth;
    y1 = Math.floor((x / fon.width) * fon.height);
    if(y1 > y) {
        x1 = Math.floor((y / fon.height) * fon.width);
        y1 = y; }
    else { x1 = x; }
    timg.style.width = x1; timg.style.height = y1;
}
</script>
</head>
<body onload="resizing();" onresize="resizing();">
<div id="fon"><img id="imgfon" src="zzz.jpg" /></div>
<div id="page">
content
</div>
</body>
</html>

archy

Дата 22.4.2008, 12:40 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 9
Регистрация: 22.4.2008

Репутация: нет
Всего: нет

Перепутал, случайно тыкнул не туда)
Не пашет, картинка просто вставляется с реальным размером.

bars80080

Дата 22.4.2008, 13:18 (ссылка)

(нет голосов)

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 44
Всего: 315

да? а нет возможности выложить это в сеть, а то у меня нормально работает под ИЕ6, ФФ и оперой

может отключено выполнение скриптов?

archy

Дата 22.4.2008, 13:29 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 9
Регистрация: 22.4.2008

Репутация: нет
Всего: нет

не, у меня всё ок. работает только под оперой почему-то ...
http:// franki.su/stuff/1.html

bars80080

Дата 22.4.2008, 13:36 (ссылка)

(нет голосов)

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 44
Всего: 315

это доктайп виноват, если выкинуть
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
то всё будет ок

к сожалению, я не знаю корректного доктайпа

archy

Дата 22.4.2008, 13:54 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 9
Регистрация: 22.4.2008

Репутация: нет
Всего: нет

выкинул доктайп и в осле теперь картинка принимает форму квадрата со стороной, равной высоте окна. в фф тоже не всё гладко - картинка вписывается в ширину, а не высоту - получается зазор снизу. мне что-то подсказывает, что стоит на эту идею забить))

bars80080

Дата 22.4.2008, 14:20 (ссылка)

(нет голосов)

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 44
Всего: 315

чёрт его знает, понятия не имею почему у тебя не работает

вот смотри, http://interes.uzelok.net/exam/resize1.php здесь нормально ведь?

archy

Дата 22.4.2008, 14:31 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 9
Регистрация: 22.4.2008

Репутация: нет
Всего: нет

да уж))) твое у меня нормально пашет, и под фф, и под оперой. не понимаю в чем у меня проблема. буду дальше ковырять, спасибо за мануал)))

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: для новичков \| Следующая тема »