Масштабирование картинок на JavaScript

MrSTEP · 16.06.2010, 13:14

Ситуация следующая: web-страница, на ней должна быть картинка предположительно большого размера (1800*1621). Изначально картинка будет отображаться на странице в 50% масштабе.
Кнопками "+10%" и "-10%" надо добавлять и отнимать по 10% масштаба, это реализуется на JavaScript. Но.

Код HTML:

document.images[0].width = document.images[0].width + 10;
document.images[0].height = document.images[0].height + 10;

меняет Истиный размер картинки на 10 пикселей, а не масштаб. Как мне реализовать изменение масштаба?

В прикрепленном файле черновой вариант с черновой же картинкой.

AlexZir · 16.06.2010, 13:57

Алексей, скрипт не изменяет размер картинки, он просто инициирует процесс сжатия пересылаемой картинки, при этом исходный файл остается неизменным. На многих сайтах для предоставления доступа к оригиналу рисунка обычно делают ссылку на него вида "просмотреть файл с наилучшим качеством".

MrSTEP · 16.06.2010, 14:01

Алексей, я понимаю, исходная картинка остается неизменной. Мне необходимо менять размер картинки на странице не в пикселях, а в процентах. Надеюсь, правильно изложил мысли

AlexZir · 16.06.2010, 14:11

Нужно производить вычисления, относительно истинного размера рисунка. Например, нужно завести счетчик количества нажатий. Соответственно, +10% увеличивает счетчик, -10% - уменьшает. Затем нужно обычным деление истинного размера на значение счетчика получить количество пикселей и прибавлять его результат к соответствующему линейному размеру картинки.

MrSTEP · 16.06.2010, 14:35

Хм, это мысль.. Попробуем

MrSTEP · 17.06.2010, 10:56

Как всегда, все гениальное просто:

Код HTML:

case 'plus':
	per = per+10; //проценты
	w = 800/100 * per;
	h = 256/100 * per;                 
	document.images[0].width = w;
	document.images[0].height = h;
break;

Спасибо, тезка

16.06.2010, 13:57	#2 (permalink)
AlexZir support Регистрация: 19.08.2007 Адрес: Зея Сообщений: 15,797 Записей в дневнике: 71 Сказал(а) спасибо: 166 Поблагодарили 203 раз(а) в 86 сообщениях Репутация: 75760	Алексей, скрипт не изменяет размер картинки, он просто инициирует процесс сжатия пересылаемой картинки, при этом исходный файл остается неизменным. На многих сайтах для предоставления доступа к оригиналу рисунка обычно делают ссылку на него вида "просмотреть файл с наилучшим качеством". __________________ Убить всех человеков!

16.06.2010, 14:11	#4 (permalink)
AlexZir support Регистрация: 19.08.2007 Адрес: Зея Сообщений: 15,797 Записей в дневнике: 71 Сказал(а) спасибо: 166 Поблагодарили 203 раз(а) в 86 сообщениях Репутация: 75760	Нужно производить вычисления, относительно истинного размера рисунка. Например, нужно завести счетчик количества нажатий. Соответственно, +10% увеличивает счетчик, -10% - уменьшает. Затем нужно обычным деление истинного размера на значение счетчика получить количество пикселей и прибавлять его результат к соответствующему линейному размеру картинки. __________________ Убить всех человеков!

17.06.2010, 10:56	#6 (permalink)
MrSTEP 一步一步地会到目的 Регистрация: 09.05.2009 Адрес: Черноземье Сообщений: 10,939 Записей в дневнике: 10 Сказал(а) спасибо: 140 Поблагодарили 80 раз(а) в 33 сообщениях Репутация: 28362	Как всегда, все гениальное просто: Код HTML: case 'plus': per = per+10; //проценты w = 800/100 * per; h = 256/100 * per; document.images[0].width = w; document.images[0].height = h; break; Спасибо, тезка

16.06.2010, 13:14
Helpmaster Member Регистрация: 08.03.2016 Сообщений: 0	Ознакомьтесь с этими ссылками Проблемы с меню в JavaScript JavaScript, раскрывающийся список JavaScript Форум и блокирование картинок в репе Как модифицировать скрипт поиска на javascript?

16.06.2010, 14:01	#3 (permalink)
MrSTEP 一步一步地会到目的 Регистрация: 09.05.2009 Адрес: Черноземье Сообщений: 10,939 Записей в дневнике: 10 Сказал(а) спасибо: 140 Поблагодарили 80 раз(а) в 33 сообщениях Репутация: 28362	Алексей, я понимаю, исходная картинка остается неизменной. Мне необходимо менять размер картинки на странице не в пикселях, а в процентах. Надеюсь, правильно изложил мысли

16.06.2010, 14:35	#5 (permalink)
MrSTEP 一步一步地会到目的 Регистрация: 09.05.2009 Адрес: Черноземье Сообщений: 10,939 Записей в дневнике: 10 Сказал(а) спасибо: 140 Поблагодарили 80 раз(а) в 33 сообщениях Репутация: 28362	Хм, это мысль.. Попробуем

Ads
Яндекс Member Регистрация: 31.10.2006 Сообщений: 40200 Записей в дневнике: 0 Сказал(а) спасибо: 0 Поблагодарили 0 раз(а) в 0 сообщениях Репутация: 55070