
21.11.2011, 19:20
|
 |
Интересующийся
|
|
Регистрация: 15.07.2010
Сообщений: 17
|
|
|
Как узнать реальный размер изображения.
Вопрос из серии "а возможно ли".
В комментарии парсится изображение
<img width="300px" alt="archive.png" src="./uploads/archive.png">
Движком в коде картинки задается ширина отображения, чтобы пользователь в комментах не испортил дизайн.
А возможно ли получить её реальную ширину?
Чтобы не растягивалась при парсинге, если например реальная картинка меньше 300px.
Последний раз редактировалось Den1xxx, 21.11.2011 в 19:37.
|
|

21.11.2011, 19:36
|
 |
Профессор
|
|
Регистрация: 06.05.2008
Сообщений: 765
|
|
|
Мне кажется, вам не в JS надо размер картинки узнавать, а на сервере.
А так вообще вроде можно картинку грузить в невидимом диве, например, и после загрузки узнать её высоту и ширину через атрибуты.
М.б. кто-то предложит более элегантный способ.
|
|

21.11.2011, 19:39
|
 |
Интересующийся
|
|
Регистрация: 15.07.2010
Сообщений: 17
|
|
Сообщение от Snipe
|
|
Мне кажется, вам не в JS надо размер картинки узнавать, а на сервере.
|
Картинка не обязательно может быть вставлена с моего сервера.
Поэтому решать лучше на стороне клиента.
В невидимом диве — это вариант конечно, но когда картинок 20 на странице, получится г..нокод.
Последний раз редактировалось Den1xxx, 21.11.2011 в 19:41.
|
|

21.11.2011, 19:41
|
 |
Модератор
|
|
Регистрация: 27.04.2010
Сообщений: 3,417
|
|
|
То есть вам нужно, чтобы картинки не были больше, скажем, 300 пикселей? Так используйте css. Что-то вроде:
img {
max-width: 300px;
height: auto;
}
|
|

21.11.2011, 20:25
|
 |
Интересующийся
|
|
Регистрация: 15.07.2010
Сообщений: 17
|
|
|
Сообщение от trikadin
|
|
вам нужно, чтобы картинки не были больше, скажем, 300 пикселей
|
Нет, мне нужно чтобы картинки не были растянуты больше их истинного размера.
То есть если картинка больше 300px, то ей присваивается ширина 300px, если меньше — остаётся первоначальный размер.
Или мне нужен ответ, что этого сделать нельзя — узнать истинный размер картинки на яваскрипт.
Последний раз редактировалось Den1xxx, 21.11.2011 в 20:28.
|
|

21.11.2011, 21:14
|
 |
Модератор
|
|
Регистрация: 27.04.2010
Сообщений: 3,417
|
|
|
"Истинный" размер узнаётся через offsetWidth/offsetHeight.
А то, что вам нужно - это тот стиль, что я скинул.
|
|

21.11.2011, 21:33
|
 |
Интересующийся
|
|
Регистрация: 15.07.2010
Сообщений: 17
|
|
|
Сообщение от trikadin
|
|
размер узнаётся через offsetWidth
|
Спасибо, поковыряю на досуге.
|
|

09.05.2012, 13:01
|
 |
Аспирант
|
|
Регистрация: 13.09.2009
Сообщений: 52
|
|
Den1xxx, ну как поковырял??))
Тоже такая проблемка встала
<img onclick="this.width=this.offsetWidth" src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif" width="200">
что-то никак, дык что никак не узнать реальный размер после изменения??
UPD: В лисе работает метод .naturalWidth
И тут материальчик есть по этой теме http://www.jacklmoore.com/notes/natu...alheight-in-ie
Последний раз редактировалось FreeStyler, 09.05.2012 в 15:48.
|
|

09.05.2012, 14:23
|
 |
Студент
|
|
Регистрация: 30.04.2012
Сообщений: 1,113
|
|
|
После изменения вот так можно получить размер
function f(src){var img=new Image();
img.onload=function(){alert(this.width)};
img.src=src}
---
<img onclick="alert(this.offsetWidth);f(this.src)"
src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif" width="200">
|
|

09.05.2012, 15:01
|
 |
''
|
|
Регистрация: 11.12.2011
Сообщений: 636
|
|
|
Den1xxx,
Истиный размер узнаётся через naturalWidth/naturalHeight. Но, это, по-моему, не кроссбраузерно.
|
|
|
|