Гость
Целевая тема:
Создать новую тему:
Автор:
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / выделить часть картинки / 25 сообщений из 35, страница 1 из 2
04.01.2010, 20:36
    #36397144
vanderv
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
Здравствуйте... помогите пожалуйста реализовать..
Допустим есть фото... мне нужно выделить отдельный участок... тобеж чтоб вся фото стала чёрной а определённый участок остался без закрашивания... фото я закрашиваю через css:
---------
opacity:1;
-moz-opacity:1;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=20);
-khtml-opacity:1;
background-color:#000;
---------
Но как выделить какойнить участок я не знаю... думаю может как-нибудь через тег area??? Только как ему задать цвет??? У меня не получалось.. Буду рад любой информации. заранее благодарю.
...
Рейтинг: 0 / 0
04.01.2010, 21:36
    #36397199
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
vandervДопустим есть фото... мне нужно выделить отдельный участок... тобеж чтоб вся фото стала чёрной а определённый участок остался без закрашивания...
Как вариант, сделать еще одну картинку с прозрачной "дыркой" нужного формата... Затем наложить такую картинку на оригинал. Т.о. можно получить видимость того, что тебе требуется...
...
Рейтинг: 0 / 0
04.01.2010, 21:56
    #36397222
vanderv
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
как вариант но только если нужен один участок... а если их много???
...
Рейтинг: 0 / 0
04.01.2010, 22:13
    #36397246
vanderv
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
а вообще есть способы искривить область div??? я сейчас виду к тому что создать область и вней делать те самые дырки.... этой области задать цвет!... я думаю может javascript такое сможет???
...
Рейтинг: 0 / 0
05.01.2010, 09:49
    #36397507
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
vandervа если их много???
Делать много таких картинок с дырками...
...
Рейтинг: 0 / 0
05.01.2010, 09:50
    #36397510
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
vandervа вообще есть способы искривить область div???
Область ДИВа - прямоугольник по определению.
...
Рейтинг: 0 / 0
05.01.2010, 09:53
    #36397516
Green2
Модератор форума
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
во флешке можно сделать это


Posted via ActualForum NNTP Server 1.4
...
Рейтинг: 0 / 0
05.01.2010, 12:20
    #36397640
IDVsbruck
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
При выделении куска фото все остальное сверху "заложить" дивами - так сказать, сэмулировать затемнение картинки (можно даже сделать еле-еле прозрачными для эффекта затемнения) - нужно всего 4 дива.
Если больше областей, то а) не совсем понятно, что выделять - область-то затемнена или б) сделать алгоритм затемнения бОльшим количеством дивов.
А серверу отдавать только координаты, а он уже будет "резать" картинку в соответствии с координатами.
...
Рейтинг: 0 / 0
05.01.2010, 14:18
    #36397812
dmitriyche
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
krvsa,

я бы не был так уверен и смех здесь лишний.
...
Рейтинг: 0 / 0
05.01.2010, 14:25
    #36397828
Zoria
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
vanderv,

можете посмотреть, как это реализовано тут:
можно покопаться под дебагом firebugом

http://www.mikesdotnetting.com/Article/95/Upload-and-Crop-Images-with-jQuery-JCrop-and-ASP.NET
...
Рейтинг: 0 / 0
05.01.2010, 14:31
    #36397841
dmitriyche
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
Вот треугольный див
...
Рейтинг: 0 / 0
05.01.2010, 14:54
    #36397875
Zoria
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
dmitriyche,

здоровски. а как текст в этот треугольник поместить? :)
...
Рейтинг: 0 / 0
05.01.2010, 16:49
    #36398040
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
dmitriycheВот треугольный див
Пример конечно ооочень заинтересовал. Но ДИВ от этого треугольным не стал. Он как занимал прямоугольную область - так и занимает.
Вот т.с. "обратная" иллюстрация.

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="RU">
    <head>
        <title>
            Треугольник
        </title>
		<meta http-equiv="Content-Type" content="text/html; charset=windows-1251;" />
        <style type="text/css">
            div.new{
                border-bottom:100px solid #FF8400;
                border-left:60px solid #FFFFFF;
                border-right:60px solid #FFFFFF;
                margin-bottom:30px;
                width: 0 ;
            }
			#my {
				background-color: green;
				padding: 20px;
			}
        </style>
    </head>
    <body>
		<div id='my'>
	        <div class="new">
	        </div>
        </div>
    </body>
</html>
----------
Cache for Windows (x86-32) 2007.1.3 (Build 607) Wed Oct 17 2007 02:12:09 EDT
...
Рейтинг: 0 / 0
06.01.2010, 15:43
    #36399026
dmitriyche
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
krvsa,

да, див на самом деле прямоугольная область, но что скажете по поводу атачмента?
...
Рейтинг: 0 / 0
06.01.2010, 15:44
    #36399029
dmitriyche
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
и скрин
...
Рейтинг: 0 / 0
06.01.2010, 15:48
    #36399033
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
dmitriycheдив на самом деле прямоугольная область
Вот этои скажу.

Но примеры безусловно интересные. Х/з конечно где такое применить... Но все же.
...
Рейтинг: 0 / 0
06.01.2010, 15:56
    #36399048
dmitriyche
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
возможно топикстартеру и поможет, хотя, ваш первый пост в этой теме как одно из верных решений.
Но, возможно, мои примеры кому-нибудь и понадобятся :)

зы оч рекомендую увидеть это - нужно всего-лишь поводить мышкой по телу девушки ;)
...
Рейтинг: 0 / 0
06.01.2010, 15:57
    #36399049
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
dmitriyche , у меня такие вопросы к тебе...
- Зачем в ЦССе приписываешь селектор тега к селектору класса. Ведь других тегов с таким классом у тебя нет...
- Зачем используешь селекторы класса, хотя сами названия классов у тебя уникальны?
...
Рейтинг: 0 / 0
06.01.2010, 16:07
    #36399063
dmitriyche
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
krvsa dmitriyche , у меня такие вопросы к тебе...
- Зачем в ЦССе приписываешь селектор тега к селектору класса. Ведь других тегов с таким классом у тебя нет...
- Зачем используешь селекторы класса, хотя сами названия классов у тебя уникальны?
Чтобы было понятнее.
Времена, когда считался каждый байт переданной информации и стоил недёшево, ушли в лету.
Когда возвращаешь к проекту через года пол, то оч сложно сразу въехать в то что тобой же написанно.
По этой причине в реальных проектах пишу в цсс так:
Код: plaintext
1.
2.
3.
div#header ul#header-navigator{
    /*some css-styles*/
}
Ещё один момент, в вопросах он не прозвучал, - это писать стили в алфавитном порядке.


зы я за понятность
зыы я никого не пытаюсь учить делать так как это делаю я
...
Рейтинг: 0 / 0
06.01.2010, 16:12
    #36399071
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
dmitriycheвозможно, мои примеры кому-нибудь и понадобятся :)
Я так ихсебе скопировал... Т.с. в копилочку...

dmitriycheзы оч рекомендую увидеть это - нужно всего-лишь поводить мышкой по телу девушки ;)
Девка сделана оочень прикольно!
Но сам сайт полный отстой. Я только поклацал по менюшке... Он разноцветный как х/з кто. Нафига им девка интересно?
Фотку девки я там нашел... А вот где проводочки х/з... Как это они реализовали?
...
Рейтинг: 0 / 0
06.01.2010, 16:13
    #36399072
dmitriyche
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
krvsa dmitriyche , у меня такие вопросы к тебе...
- Зачем используешь селекторы класса, хотя сами названия классов у тебя уникальны?
ИМХО
Это ещё не факт. Экзеипляров этого класса может быть сколько угодно (в процессе ковыряния, игр и проч), а документ должен оставаться валидным в любом случае.
...
Рейтинг: 0 / 0
06.01.2010, 16:15
    #36399076
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
dmitriycheЕщё один момент, в вопросах он не прозвучал, - это писать стили в алфавитном порядке.
Этого я вообще не ожидал...

dmitriycheзы я за понятность
Вот я и интересуюсь как, кто и зачем делает так или иначе. Поскольку "понятность" дело относительное.
...
Рейтинг: 0 / 0
06.01.2010, 16:19
    #36399080
dmitriyche
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
krvsa
Девка сделана оочень прикольно!
Но сам сайт полный отстой. Я только поклацал по менюшке... Он разноцветный как х/з кто. Нафига им девка интересно?
Фотку девки я там нашел... А вот где проводочки х/з... Как это они реализовали?
Этот сайт студия Лебедева делала. Скорее всего, мнением клиента особо не интересовались.
Сам когда-то фаербагом пробовал разобрать реализацию, но как увидел сколько дивов образует один кружочек, понял что дело не благодарное. Но в плане механизма построения ребята молодцы:)
...
Рейтинг: 0 / 0
06.01.2010, 16:22
    #36399084
dmitriyche
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
krvsa
Вот я и интересуюсь как, кто и зачем делает так или иначе. Поскольку "понятность" дело относительное.
Не могу не согласиться:)
Сейчас увлёкся шаблонами проектирования и рефакторингом кода. Начал зачитываться Кетом Беком. Он пишет очень умные мысли. Сейчас попытаюсь найти и процитировать.
...
Рейтинг: 0 / 0
06.01.2010, 16:29
    #36399095
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
выделить часть картинки
dmitriycheЭтот сайт студия Лебедева делала.
О!
Он вроде как гуру в дизайне. Значит я не понял их авангардистских идей...

Но полюбому с бабой они переборщили.
...
Рейтинг: 0 / 0
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / выделить часть картинки / 25 сообщений из 35, страница 1 из 2
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]