Быстрая перекраска вещей на сайте

[mxc]

Спасибо большое. Казалось все сложнее.

[Tvarb]

Можно и сложней градиенты подкладывать
делали по такому же принципу :)
молодец, что описал

[Grayscale]

Да конечно можно, но всеголишь пример описал :)

[Somebody32]

Придираюсь, но на странице примера все же надо «выберите цвет»

[Grayscale]

Да, точно, спасибо)))

[Devgru]

Ничего такого, на er.ru висело подобное «выберете партию».

[Devgru]

Кстати, странный топик для человека с таким ником.

[Grayscale]

Первый кто оценил )))

[artch]

А если прикрутить какой-нибдуь колорпикер, то можно сделать выбор произвольного цвета на месте. Так сделано у меня на Клавогонках — юзер может выбирать цвет машинки.

[Grayscale]

На автокадабре тоже так сделано :) и вообще можно много чего :) на то и мозги что бы придумать :)

[MKrivosheev]

habrahabr.ru/blogs/iconoskaz/18805/ — про автокадабру

[Grayscale]

turbomilk.ru/portfolio/icons/autokadabra-icons/
Это вот от самого турбомилка…

[KELLiON]

Ну через колор-пикер картинку на фон нельзя поставить. Можно смешать колор пикер и набор картинок, тогда возможно будет поудобнее, хотя это еще вопрос.

[artch]

Колорпикер будет менять цвет фона.

[Londeren]

[offtop]
так вот кто сделал этот шикарный сайт))
гоняюсь там бывает…
[/offtop]

[Londeren]

автору статьи хотелось бы пожелать использовать текстовый редактор
некоторые ошибки уж больно сильно глаз режут…
сори за занудство))

[Grayscale]

Да ничего страшного))) понимаю, но на сегодня уже сил нет исправлять)

[muradali]

именно так сделано и у нас в авингрупе при выборе цвета автомобиля в каталоге, только там посложнее пришлось рисовать…

[Grayscale]

Devgru уже приводил пример с автомобилями )) да, сложнее…

[Devgru]

Странно, кажется, это был какой-то неправильный Devgru.

[Grayscale]

Извини, промазал))))

[Devgru]

ничего)

[Tvarb]

имеено со сложными моделями — там много от дизайнеров зависит.
Полутени, градиенты в прозрачность :)

[harhan]

ух ты! фотошоп на русском! просто честно — я и так далеко не гуру, но просто подумалось что если мне сейчас подсунут русский фотошоп — буду чувствовать себя ребенком :)

топик один из лучших, скажите пожалуйста, можно ли его перепостить?

[Grayscale]

Да, можно, я не против)

[skylix]

Простите, но явно не «выбирите» х_х

[Grayscale]

Да, на самой странице исправил, а на скриншоте забыл :(

[Uratsakidogi]

Дополнительно можно заморочится с дополнительным элементом, чтобы узоры правильно отражались (сейчас — не очень). Хотя в простых случаях, как в примере, можно просто заморочиться с позиционированием фоновой картинки для одного элемента.

[Grayscale]

Да, так изначально и было))) просто потом забыл поправить)

[theKitich]

Толково :)
Впервые на эту мысль наткнулся тут: www.kulish.ru/websites/works_avingroupsite,process.html
А у Вас описание самой технологии )

[homm]

www.artlebedev.ru/everything/backstage/icon-reflections/
Не хорошо как-то получается.
Нет, я не хочу сказать что кто первый опубликавал статью, тот технику и придумал, но и вы не можете претндавать на авторство техники.
Конечно можно сказать что статья полезна описанием процесса создания айпода, но тогда ей место в уроках фотошопа.

[Grayscale]

ОМГ, да никто и не притендует)) я думаю что это вообще придумали еще задолго до Т.Герасименко )))))

[Grayscale]

Вот если честно воообще не приследовал цель идеально отрисовать айпод (который до этого кто-то отрисовал и не факт что привильно)

[pseudopanda]

жаль, в жёлтый нельзя покрасить, э-эх. А еще рядом с цветом можно написать красивое название: «Ультра», «Banano»…

[Rengised]

фуууу, русский фотошоп)

[Grayscale]

Это спецом для всяких скриншотов)))))))))

[deerua]

awesome^{10 тыщ раз}
вот так нужно делать мануалы для фотожопа!

[pgg]

Велосипед изобрели давно

[jAx]

На чуть-чуть моя веб-жизнь стала ярче. Буду вашу реализацию вкладывать в свои работы. Реально спасибо.

[Devgru]

Эта техника кстати довольно стара, и используется, например на "странице-в-клочья", для логотипов — таким образом под логотип можно положить фон нужного цвета и он перекрасится. Удобно на самом деле.

[Grayscale]

Я с огромной радостью прочитаю ваши профессиональные статьи) нет, правда) очень жду) и думаю не я один)

[Grayscale]

Комент к комменту ниже…

[glazs]

Очередная статья в духе «Веб разработка для даунов».
И, разумеется, для удобства jQuery. Жду статью про использования тега IMG.

[imps]

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

function MM_swapImgRestore() {
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_swapImage() {\
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}

А пример использования такой вот:

<img name="somename" src="imagetoswaplink" width="somewidth" height="someheight" 

onMouseOver="MM_swapImage('somename','','imagewhichwillswap')" 

onMouseOut="MM_swapImgRestore()" />

[imps]

Собственно к последнему коменту как раз получилось :)

[pepelsbey]

Вы из какого бабушкиного сундука достали этот скрипт? Его писала компания, которой уже даже не существует…

Если уж автор использует в статье jQuery, то рекомендовать ему этот антиквариат точно не стоит.

[imps]

Непонятно за что минусуют, наверно за то что поделился вариантом. На самом деле всё зависит от цели. Я использовал скрипт для простого сайта не нагруженого ничем, кроме пары функций.

Может кому то всё же пригодится.

Никому ничего не навязывал, а тем более автору, я всего лишь предложил другой вариант.
Но это ведь не значит что нужно использовать именно его ;)

[egoisto]

похоже на Dreamweaver

[imps]

Да, именно из бесплатного шаблона для него я и взял парочку функций.

[almalexa]

Пользовался таким методом и раньше, но всё равно спасибо, очень детально расписали)

[koldarev]

тут пришлось заюзать прозрачность png'шки для смены цвета (параметру «си» назначается цвет в hex'e, можно поиграться).
просто и почти на любой вкус )
*на правах примера*

[WebMast]

Крутая вещица. Наконец-то я узнал как это делается!

[hlomzik]

Вы про самую суть не написали — как можно из заданной картинки сделать нужный png с нужными полупрозрачностями? iPod — слишком элементарный пример.
Т.е. фактически задача такая — мы имеем картинку, состоящую из «фонового», белого и промежуточных между ними цветов. И нужно создать маску, основанную на яркости белого цвета.

[Grayscale]

В конце статьи я привел ссылку на статью с большим количеством примеров примерной отрисовки похожих предметов. Если их даже просто прочитать то все станет ясно.

[PDmitriy]

www2.victoriassecret.com/commerce/onlineProductDisplay.vs?namespace=productDisplay&origin=onlineProductDisplay.jsp&event=display&prnbr=9G-214503&cgname=OSKEYCLOZZZ&rfnbr=2201

[pepelsbey]

Это обычная смена картинок:

Вот — красные, вот — фиолетовые… скучно.

[PDmitriy]

но красиво

[pepelsbey]

Это тоже был гей-тест? )

[PDmitriy]

:)

[Triaffer]

Решение для ресурсов, на которые не ходят пользователи IE 6 :)

[Grayscale]

Человечество уже давно решило эту проблему ;)

[caIIIa]

Русский Photoshop?

[Grayscale]

Где-то выше уже нираз поднималась эта тема)))))

[caIIIa]

Да уже заметил, каюсь :)