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

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

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

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

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

У картинки есть собственное событие onload.
...
Рейтинг: 0 / 0
16.01.2010, 13:16
| Ответить | Цитировать | Написать  
Пропорциональное масштабирование картинки
    #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
16.01.2010, 14:52
| Ответить | Цитировать | Написать  
Пропорциональное масштабирование картинки
    #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, 21:25
| Ответить | Цитировать | Написать  
Пропорциональное масштабирование картинки
    #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
17.01.2010, 22:02
| Ответить | Цитировать | Написать  
10 сообщений из 10, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Пропорциональное масштабирование картинки
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&fpage=265&tid=1453674]:
 0ms
get settings:
 7ms
get forum list:
 21ms
check forum access:
 4ms
check topic access:
 4ms
track hit:
 70ms
get topic data:
 12ms
get forum data:
 3ms
get page messages:
 61ms
get tp. blocked users:
 2ms
others: 213ms
total:  397ms
созд. / загр.: 397ms
x
x
Закрыть


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