Как сделать "выдвигающиеся" картинки на сайте?

zakysj50

Какими средствами можно сделать на сайте, чтобы при наведении мышки на одну из нескольких картинок - картинка вылезала на первый план и увеличивалась в размере?

hashion

я ещё понимаю когда такие вопросы задают про какуюнить библиотеку виджетов, но "на сайте" - открой html-код и посмотри!

zakysj50

а ты знаешь примеры таких сайтов?

v_Alex

fakultet.ru?

feliks28

А ты это только что сам придумал?

zakysj50

меня попросили сделать такое на сайте.
как я понимаю для флэша вообще нет невозможного. интересуют альтернативные способы...

tipnote

1) При подгрузке картинки в админку сайта создавать несколько отмасштабированных копий.
2) Джаваскриптом на mouseover и mouseout изменять урл картинки.
?

tipnote

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

kruzer25

1) При подгрузке картинки в админку сайта создавать несколько отмасштабированных копий.
2) Джаваскриптом на mouseover и mouseout изменять урл картинки.

Есть лёгкий thumbnail, есть тяжёлая картинка. Показываем thumbnail, при нажатии на него ждаваскриптом подменяем img src на адрес самой картинки и руками плавно меняем размеры объекта img с исходных до нужных.

slonishka

А ты это только что сам придумал?

маководы придумали наверное

Commandor

Чую это не совсем то, что хочет автор. Т.к. в этом случае картинка будет разъезжаться не "над" страницей, а "внутри" нее, растягивая все подряд.
Я делал так: при наведении на картинку рисовал над ней div с абсолютными координатами и клонированной позицией, вставлял в него дубликат этой картинки (чтоб сразу отобразилась из кэша браузера а потом разъезжал этот див, одновременно меняя src на правильный.

zakysj50

а у тебя не осталось кода?

doublemother

Если вы не хотите придумывать и писать сами, то можно воспользоваться хорошей js-библиотекой Prototype-window. Но весит она, извиняюсь, 120кб, которые ваш браузер будет вынужден грузить. Хотя если вы научите апач гзиповать и заставлять кэшировать js...

Werdna

Но весит она, извиняюсь, 120кб, которые ваш браузер будет вынужден грузить.

Всегда удивляло зачем такие библиотеки для какой-то фигни.
Выдрать оттуда 1 функцию и не париться.

doublemother

Еще проще самому написать. А те, кто не могут - пользуются фреймворками.

SCIF32

Еще проще самому написать. А те, кто не могут - пользуются фреймворками.

и много коммерческих продуктов Вы выпустили?

Ivan2009

Если вы не хотите придумывать и писать сами, то можно воспользоваться хорошей js-библиотекой Prototype-window

пока он разберется как ей пользоваться можно 10 подобных функций написать

function rollOver(img, ref) {

    document.getElementById(img).src = ref;

}



<a href="/page.php" onmouseover="rollOver('img_id','/images/icons_big.gif');" 

onmouseout="rollOver('img_id','/images/icons_sm.gif');"><img src="/images/icons_sm.gif" id="img_id"></a>  

SCIF32

это ты учел?

Чую это не совсем то, что хочет автор. Т.к. в этом случае картинка будет разъезжаться не "над" страницей, а "внутри" нее, растягивая все подряд.

Ivan2009

ааа. понял
ну тогда через див, как предлагали выше
так сделано в контакте (если зайти в календарь и наводить на людей у которых дни рождения)