2013-05-02 7 views
0

Я видел очень хорошую домашнюю страницу на templatemonster и im, пытаясь сделать мою домашнюю страницу похожей, и проблема заключается в главном изображении. он не будет масштабироваться одинаково, и я понятия не имею, что я должен искать. Я искал динамическую картинку, но не нашел ничего.Динамическое изменение размера изображения

Сайт со сценарием изображения: http://livedemo00.template-help.com/wt_43701/#!/pageSplash Попробуйте изменить размер окна, и вы увидите, что изображение будет уменьшаться, а некоторые части изображения будут перемещаться за пределами окна.

Сайт им работать на это: http://dq.se/formbar/ основное изображение имеет только один тег, и это

width:100%;

Пожалуйста, помогите мне найти способ, что мой образ имеет мин-высота: 500px; и если окно станет меньше, изображение будет разрезано по бокам.

/Axel

+0

Я не смог увидеть любого сжиматься эффектом. Но в любом случае вы можете использовать расширение DevTool или Firefox Firebug для проверки страницы и изучения. – Passerby

+0

Вы можете установить его как фоновое изображение и использовать ['background-size: cover'] (http://css-tricks.com/perfect-full-page-background-image/) или этот [плагин jQuery] (http://christianvarga.com/blog/2011/05/jquery-resize-image-to-parent-container-plugin/), если это должен быть образ. Кроме того, проверьте свою консоль, ваш код возвращает кучу ошибок. –

ответ

1

хорошо, если у вас есть min-height:500px; попробовать overflow:hidden; это скрыть остальную часть вашего изображения после сжатия до 500px

маленькой скрипки: here

+0

Да, это может сработать, но изображение теперь исчезнет с правой стороны. Я хочу, чтобы лицо и волосы всегда были в центре внимания. самая картина может быть «разрезана» на кончике ее носа и до конца ее волос. пытался использовать: 'left: 50%;' и marginleft: -50%; или что-то типа того . –

+0

, тогда вы должны jquery, чтобы исправить это, я думаю. или кто-то еще должен знать собеседника – DiederikEEn

Смежные вопросы