Ефект на мащабиране на снимки с jQuery
Днес ще ви покажа как да създадете прост ефект на мащабиране с помощта на jQuery.
Идеята е да се показват увеличени изображения и при задържане на мишката изображението се плъзга назад и става напълно видимо.
Подобен ефект може да се използва при различни фотографи и сайтове за фото галерии. Демо версията използва черно-бели снимки.
Маркиране
CSS
Обвивката за връзката и изображението ще бъдат плаващи наляво и ще имат относителна позиция. Изображението ще бъде абсолютно позиционирано.
Както споменахме по-рано, изображението е с височина 333 пиксела. Искаме изображението да се доближи, затова задаваме по-голям размер. В този пример това е 500 пиксела. Когато определим размера само от едната страна, изображението ще преоразмери съответно другата страна и не е нужно да се притеснявате за това.
Функцията за преместване на мишката върху изображенията ще бъде изключително проста: правим изображението прозрачно, променяме височината на 200 пиксела и задаваме горната и лявата страна на 0. Когато мишката се премести, всичко се връща на мястото си.
Това е! Надявам се да ви е харесало! :)
Този урок е подготвен за вас от екипа на ruseller.com Източник на урока: www.tympanus.net Превод: Максим Шкурупий Урокът е създаден: 12 март 2010 г. Преглеждания: 25693 Правила за препечатване
5 последни урока от рубриката "Разни"
Как да хоствате уебсайта си? Правилно избраният добър хостинг е бъдещето на вашите сайтове
Проектът е готов, всичко е проверено на локалния OpenServer сървър и можете да прехвърлите сайта на хостинга. Но коя фирма да избера? Предлагам да обмислите хостинг на fornex.com. Страхотно място за вашия проект с перспектива за бързо развитие.
Разработка на уеб сайт чрез онлайн платформаWrike
Създаването на уеб сайт е трудоемък процес, който изисква добре координирано взаимодействие между клиента и изпълнителя, както и между всички членове на екипа, участващи в проекта. И онлайн платформата Wrike ще бъде от голяма помощ в това.
20 Ресурси за създаване на прототипи
Избор от десетки ресурси за създаване на макети и прототипи.
Топ 10 безплатни хостинг услуги
Малка селекция от безплатни хостинг доставчици с подробно описание.
Бърза бележка: Групово АКТУАЛИЗИРАНЕ в MySQL
Не е тайна как да внедрите масово INSERT в MySQL, но с UPDATE може да е трудно. За да не прибягвате до манипулации на събитието ON_DUPLICATE, можете да използвате специалната конструкция CASE ... WHEN ... THEN.