Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Пропорциональное масштабирование картинки / 10 сообщений из 10, страница 1 из 1
13.01.2010, 19:54:47
    #36408415
Hett
Hett
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Пропорциональное масштабирование картинки
Новая проблема :)
Есть контейнер DIV, в нем должна умещаться картинка. Если у картинки ставить высоту и ширину в процентах - то это будет размер относительно ее контейнера. Вобщем здесь вроде все хорошо, но как быть, если нужно чтобы картинка умещалась в DIV но при масштабировании сохраняла пропорции?

Если плохо объяснил, то вот здесь нажмите на картинку и станет понятно что я хочу...
http://hett.gooddev.ru/mywork/gallery/
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.01.2010, 12:17:24
    #36409414
Antonariy
Antonariy
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Пропорциональное масштабирование картинки
Маштабировать по одной оси, либо по вертикали либо по горизонтали, в зависимости от того, что у картинки больше.

Jah loves you.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.01.2010, 14:45:44
    #36409955
Hett
Hett
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Пропорциональное масштабирование картинки
Я об этом думал, но не знаю как узнать размеры картинки... Тем более до того как она загрузилась... это можно вообще? А там вообще можно сделтаь что-то типа буфера? В него бы картинка грузиласЬ, потом узнавались и выставлялись размеры а потом отображалась на экран.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.01.2010, 15:42:04
    #36410143
Antonariy
Antonariy
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Пропорциональное масштабирование картинки
Можно сделать картинку размером 1 пиксель и изменять этот размер после загрузки.

Jah loves you.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
14.01.2010, 15:42:54
    #36410147
Antonariy
Antonariy
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Пропорциональное масштабирование картинки
Да, после загрузки можно.

Jah loves you.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.01.2010, 13:12:22
    #36413674
Hett
Hett
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Пропорциональное масштабирование картинки
А как узнать когда картинка загрузилась и как определить размер?
А можно ее как бы в буффер загрузить а потом отобразить?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.01.2010, 13:16:32
    #36413683
ShSerge
ShSerge
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Пропорциональное масштабирование картинки
Hett,

У картинки есть собственное событие onload.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
16.01.2010, 14:52:57
    #36413749
Ренат
Ренат
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Пропорциональное масштабирование картинки
HettА как узнать когда картинка загрузилась и как определить размер?
А можно ее как бы в буффер загрузить а потом отобразить?
а как ajax галереи работают? выводят рисунок - зугрзка, а потом как загрузиться в память, красиво с эфектом выводят ее на экран)
ну принцип вроде такой
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
 var b=new Image();
 b.src = 'newimg.jpg';
 b.onload = function(){
 var img =  document.createElement('img');
 img.srcc = b.src;
 var new_w =  200 ;
 var s = new_w/b.offsetWidth;
 img.style.width = new_w+'px';
 img.style.height = Math.round(b.offsetheight*s) + 'px';
 document.body.appendChildren(img);
 }
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
17.01.2010, 21:25:00
    #36414852
Hett
Hett
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Пропорциональное масштабирование картинки
ЧТо я делаю не так?

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
    function setImage(imgUrl)
    {
        var imgObg = new Image();
        imgObg.src = 'http://sql.ru/images/reply.gif';

        imgObg.onload = function(){
            alert( 1 );
            document.getElementById('image').src = imgObg.src;
        }

    }
Событие onload не происходит...
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
17.01.2010, 22:02:50
    #36414893
Hett
Hett
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Пропорциональное масштабирование картинки
Дошло. Нужно сначала назначить событие, а потом грузить рисунок, что вполне логично. Но почему-то в этом интернете все примеры сначала изменяют src а потом назначают событие... нипанятна...

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
    function setImage(imgUrl)
    {
        var myImg = new Image();
        myImg.onload = function(){
             alert( 1 );
             document.getElementById('image').src = myImg.src;
        }
        myImg.src = 'http://sql.ru/images/reply.gif';
    }
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Пропорциональное масштабирование картинки / 10 сообщений из 10, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение  
Полит. конфиден.  
созд. / загр.: 620ms
Закрыть
start [/forum/topic.php?fid=22&mobile=1&tid=1453674]:
 0ms
get settings:
 9ms
get forum list:
 18ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 282ms
get topic data:
 13ms
get forum data:
 4ms
get page messages:
 61ms
get tp. blocked users:
 2ms
others: 225ms
total:  620ms
x
x
Закрыть


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