Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > JavaScript: Общие вопросы > Картинка по частям


Автор: rtm 20.11.2005, 23:00
Возможно-ли загрузить только часть большой картинки?

Автор: godsgame 21.11.2005, 11:42
хмм... присоединяюсь...
можно ли большую картинку загнать в ячейки таблицы?
т.е ячейки таблицы - составляют картинку.

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

Автор: rtm 21.11.2005, 16:23
используя javascript не получится
а вот в php есть функция: imageCopyResized
Цитирую:
Цитата
imageCopyResized
Копирование части рисунка с масштабированием.
Синтаксис :
int imageCopyResized(int dst_im, int src_im, int dstX, int dstY, int srcX, int srcY, int dstW, int dstH, int srcW, int srcH)

Эта функция - одна из самых мощных и универсальных. С помощью нее можно копировать изображения (или их участки), перемещать или масштабировать их.

dst_im задает идентификатор изображения, в который будет помещен результат работы функции. Это изображение должно уже быть создано или загружено и иметь надлежащие размеры.

src_im - идентификатор изображения, над которым проводится работа. Впрочем, src_im и dst_imмогут и совпадать.

Параметры srcX, srcY, srcW, srcH задают область внутри исходного изображения, над которой будет осуществлена операция - соответственно, координаты ее верхнего левого угла, ширину и высоту.

Наконец, четверка dstX, dstY, dstW, dstH задает то место на изображении dst_im, в которое будет "втиснут" указанный в предыдущей четверке прямоугольник. Заметьте, что, если ширина или высота двух прямоугольников не совпадают, то картинка автоматически будет нужным образом растянута или сжата.
В следующем примере файл file1.jpg уменьшается вдвое и записывается в файл file2.jpg:


Код

<?php
$old = imageCreateFromJpeg("img/file1.jpg");
$w = imageSX($old);
$h = imageSY($old);
$w_new=rounr($w/2);
$h_new=round($h/2);
$new = imageCreate($w_new, $h_new);
imageCopyResized($new, $old, 0, 0, 0, 0, $w_new, $h_new, $w, $h);
imageJpeg($new, "img/file2.jpg");
imageDestroy($old);
imageDestroy($new);
?>


Автор: Sardar 21.11.2005, 19:10
Цитата(rtm @ 20.11.2005, 22:00)
Возможно-ли загрузить только часть большой картинки?

Нет, можно показать только часть большой картинки (стиль clip), но грузиться она будет полностью. На счёт GD'шных функций можно ещё поспорить, иногда настройки качества закрученны на нет, результирующая картинка страшного вида smile

На встречу: зачем это понадобилось?

Автор: rtm 21.11.2005, 21:27
спасибо за стиль. попробую.
Отвечаю на вопрос:
Цитата
зачем это понадобилось?

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





Автор: rtm 21.11.2005, 21:31
Это?
Цитата

clip - Задает или возвращает прямоугольный фрагмент элемента страницы, который будет видим. {Объект стиля}.clip[ = "auto|rect({Верхняя граница} {Правая граница} {Нижняя граница} {Левая граница})"]; Предопределенное значение auto задает видимость всего элемента страницы (значение по умолчанию). Для того чтобы ограничить видимую часть элемента страницы прямоугольным фрагментом, задаются координаты границ этого прямоугольника, разделенные пробелами. Поддерживается IE начиная с 4.0

clip.bottom - Задает или возвращает вертикальную координату нижней границы видимого прямоугольного фрагмента слоя. {Объект стиля}.clip.bottom[ = "auto|{Y}"]; Поддерживается NN начиная с 4.0

clip.height - Задает или возвращает высоту видимого прямоугольного фрагмента слоя. {Объект стиля}.clip.height[ = {Y}]; Поддерживается NN начиная с 4.0

clip.left - Задает или возвращает горизонтальную координату левой границы видимого прямоугольного фрагмента слоя. {Объект стиля}.clip.left[ = {X}]; Поддерживается NN начиная с 4.0

clip.right - Задает или возвращает горизонтальную координату правой границы видимого прямоугольного фрагмента слоя. {Объект стиля}.clip.right[ = {X}]; Поддерживается NN начиная с 4.0

clip.top - Задает или возвращает вертикальную координату верхней границы видимого прямоугольного фрагмента слоя. {Объект стиля}.clip.top[ = {Y}]; Поддерживается NN начиная с 4.0

clip.width - Задает или возвращает ширину видимого прямоугольного фрагмента слоя. {Объект стиля}.clip.width[ = {X}]; Поддерживается NN начиная с 4.0

clipBottom - Возвращает вертикальную координату нижней границы видимого прямоугольного фрагмента элемента страницы. {Объект}.currentStyle.clipBottom; Предопределенное значение auto говорит о том, что элемент страницы полностью видим. Свойство доступно только для чтения. Поддерживается IE начиная с 5.0

clipLeft - Возвращает горизонтальную координату левой границы видимого прямоугольного фрагмента элемента страницы. {Объект}.currentStyle.clipLeft; Предопределенное значение auto говорит о том, что элемент страницы полностью видим. Свойство доступно только для чтения. Поддерживается IE начиная с 5.0

clipRight - Возвращает горизонтальную координату правой границы видимого прямоугольного фрагмента элемента страницы. {Объект}.currentStyle.clipRight; Предопределенное значение auto говорит о том, что элемент страницы полностью видим. Свойство доступно только для чтения. Поддерживается IE начиная с 5.0

clipTop - Возвращает вертикальную координату верхней границы видимого прямоугольного фрагмента элемента страницы. {Объект}.currentStyle.clipTop; Предопределенное значение auto говорит о том, что элемент страницы полностью видим. Свойство доступно только для чтения. Поддерживается IE начиная с 5.0

Автор: Sardar 21.11.2005, 23:44
Тогда лучше помещать картинку в бекграунд и изменять позицию, вот пример: http://www.cssplay.co.uk/menus/menu5teen.html

Стиль - да этот.

Автор: rtm 23.11.2005, 09:01
Спасибо.

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)