Одинаковая высота картинок
Здравствуйте! Очень нужна ваша помощь. Пожалуйста подскажите как при помощи джаваскрипт написать код который будет выравнивать высоту картинок и пропорционально уменьшать их ширину. Другими словами у меня нужен скрипт, который бы автоматически выравнивал высоту картинок и пропорционально уменьшал ширину.
|
Высота картинок какая должна быть? Если вы ставите только высоту, то ширина выставится пропорционально соотношению сторон. и делается это стилями.
в данном случае высота в 500 пикселей выставлена у всех картинок
<style>
img{
height:500px;
}
</style>
<img src=screen.jpg>
<img src=screen.jpg>
<img src=screen.jpg>
|
мне нужно сделать следующее:
У изображений сделать ограничение по максимальной ширине и по высоте, так, чтобы все надписи - (названия товаров) были на одном уровне. Максимальную ширину оставить 150 пикселей, максимальную высоту сделать также 150 пикселей. Т.е. изображение похожего товара, сначала, уменьшается по высоте до 150 пикс, и если при этом ее ширина больше 150 пикселей изображение также уменьшается до нужной ширины. |
Как вариант - пихать в div с переполнением, только скрыв полосы прокрутки. Тогда можно "обрезать" выступающие части без трансформации картинки на уровне gd2.
|
нет мне нужен джаваскрипт
|
Да не нужен вам js
будет как вы описали - но стилями. Так будет быстрее работать. <style> img{ max-height:150px; max-width:150px; } </style> <img src=screen.jpg> <img src=screen.jpg> <img src=screen.jpg> |
скажем так начальство требует джава скрипт, было написано на php, но хотят джаваскрипт и ничего не могу с этим сделать
|
Irina13,
Вариант ...
<!DOCTYPE html>
<html>
<head>
<title></title>
<script language="JavaScript" type="text/javascript">
function imgminimum(obj)
{var imgmax = 150; // максимальный размер картинки
var h = obj.height;
var w = obj.width;
if (h>imgmax||w>imgmax){if (h>w) {obj.height=imgmax}else {obj.width=imgmax}};
}
function img_all()
{
var img = document.getElementsByTagName('img');
for (var i=0; i<img.length; i++) {
imgminimum(img[i])
}
}
window.onload = img_all
</script>
</head>
<body>
<img src="http://igrushka.kz/vip45/imn2/0-18-11.jpg" border="0" alt="" />
<img src="http://www.dogi.ru/agency/images/akita1.jpg" border="0" alt="" />
</body>
</html>
|
Спасибо Вам большое!!!! Вы меня оч оч выручили!!!! СПАСИБО!!!!! БОЛЬШОЕ БОЛЬШОЕ!!!! ПРОСТО ОГРОМНОЕ!!!!!
|
Буду теперь джавускрипт учить.
|
Выглядит примерно так:
1: хочу трахаться, где взять мешок с дерьмом? 2: зачем мешок? сними шлюху 1: нет, мне нужен мешок 2: да не нужен вам он, как вариант - вот хорошая девушка 1: скажем так начальство требует обмазываться дерьмом и дрочить, и ничего не могу с этим сделать 2: ок, вот, бери ... |
Плакал.
|
Спасибо начальству на моё хорошее настроение :)
|
Знаете, я конечно спорить с Вами не буду, может вы и правы. Но во-первых везде есть приделы разумного, когда можно согласиться, а когда нет. В этом вопросе я согласилась, хотя и считаю его бредом. Но как то я сомневаюсь, что вы будете оплачивать мои счета, если я пошлю начальство к черту. Т.к. вразумительно объяснить не вариант.
|
рони,
А можно как то в этом скрипте класс прописать, чтобы код выполнялся не для всех картинок а только для тех у которых прописан данный класс? |
Irina13,
:cray:
function img_all()
{
var img = document.getElementsByTagName('img');
for (var i=0; i<img.length; i++) {
if(/red/.test(img[i].className)) imgminimum(img[i])
}
}
вместо red впишите название нужного класса и учите javascript Выборка по классу |
| Часовой пояс GMT +3, время: 11:19. |