Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > Вёрстка веб-сайтов > Мне надо в изображение вставить кнопки


Автор: ReDuX 20.4.2008, 15:58
Добрый вечер...
У меня есть картинка, мне в ней надо сделать кнопки, она у меня стартовая index. в системе ucoz.ru
Пользуюсь я dreamweaver. Сижу уже 20 часов и не могу понять как вставить...
Помогите мне решить эту проблему

Автор: Itsys 20.4.2008, 18:39
Я ничего не понял а Вы? smile

ЗЫ Если на такой вопрос кто-нибудь ответит правильно, то ему можно давать диплом экстрасенса. 

Автор: SelenIT 20.4.2008, 19:05
Если не нужно визуального эффекта нажатия, то можно использовать image map (как сделано верхнее меню на этом форуме). Либо же сделать картинку фоном, тогда на ней можно будет размещать что угодно.

Автор: ReDuX 20.4.2008, 21:36
Я разобрался с этим...
теперь след вопрос, как мне на указанные область поместить текст???

Автор: Itsys 21.4.2008, 06:38
один вопрос один пост а ты как сделал, фоном или картой?

Автор: ReDuX 21.4.2008, 09:43
картинка)))
а как делать чтобы не могли ее сохранить? я видел делают как-то.... ее не выделить не скопировать нельзя, как дак делать?

Автор: Demonis 21.4.2008, 10:01
Разве что сделать эту картинку фоном контейнера. smile
Но сохранить ее можно будет в любом случае ;)

Автор: ReDuX 21.4.2008, 14:53
а как сделать? не дадите ли вы мне ТЕГ)

Автор: bars80080 21.4.2008, 15:07
имеется ввиду задать картинку фоном для контейнера, т.е.
Код
<style>
#but1 { width: 100px; height: 30px; background: url(zzz.jpg); text-align: center; }
#but1 a { width: 100%; height: 100%; }
</style>
<div id="but1"><a href="#">link</a></div>
 но стибрить картинку при желании всё равно будет можно

Автор: ReDuX 21.4.2008, 16:31
bars80080, 
вот посмотрите we.ucoz.de
эта картинка вот...
и видете там справа панель? как мне ее пометсить на картинку???
да и еще вопрос, как правильно мне внедрить этот ТЕГ)

Добавлено через 4 минуты и 17 секунд
Код

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Выберите расширение для паковки" content="text/html; charset=koi8-r" />
<title>Наш клан ;)</title>
<meta http-equiv="Выберите расширение для паковки" content="text/html; charset=koi8-r" />
<style type="text/css">
<!--
.стиль1 {font-family: "Times New Roman", Times, serif}
-->
</style>
</head>




<title>$SITE_NAME$ - $PAGE_NAME$</title>
<link type="text/css" rel="StyleSheet" href="http://src.ucoz.ru/src/css/231.css" />
</head>

<body>



<table width="100%" height="55" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td align="right" height="25"><?if($USERS_ON$)?>
        <?if($USER_LOGGED_IN $)?>
      Ты зашёл как <a href="$PERSONAL_PAGE_LINK$"><b>$USERNAME$</b></a> | Группа "<u>$USER_GROUP$</u>"
      <?else?>
      Приветствую Вас <b>$USERNAME$</b>
      <?endif?>
      <?endif?>
      | <a href="$RSS_LINK$">RSS</a></td>
  </tr>
  <tr>
    <td align="right" height="18" valign="top"><a href="$HOME_PAGE_LINK$">Главная</a> | <a href="$PAGE_URL$">
      <?if($URI_ID$="page1")?>
      <?else?>
      $PAGE_NAME$
      <?endif?>
      </a>
        <?if($USERS_ON$)?>
      <?if($USER_LOGGED_IN$)?>
      | <a href="$PERSONAL_PAGE_LINK$">Мой профиль</a>
      <?else?>
      | <a href="$REGISTER_LINK$">Регистрация</a>
      <?endif?>
      <?endif?>
      <?if($USERS_ON$)?>
      <?if($USER_LOGGED_IN$)?>
      | <a href="$LOGOUT_LINK$">Выход</a>
      <?else?>
      | <a href="$LOGIN_LINK$">Вход</a>
      <?endif?>
      <?endif?></td>
  </tr>
</table>


<tr><td valign="top"><div align="center"><a href="http://www." target="_blank"><img src="nabrosok-beta2.jpg" alt="" width="900" height="675" border="0" usemap="#Map" />
 <map name="Map" id="Map">
   <area shape="poly" coords="137,243,116,257,107,269,96,293,91,312,88,337,74,352,65,369,65,386,82,405,92,416,72,425,76,442,89,437,102,439,108,433,119,438,112,451,107,463,92,459,69,457,58,463,50,480,46,489,108,513,130,517,139,511,136,489,132,485,131,476,139,449,158,430,174,428,192,448,192,462,185,478,174,489,173,504,208,510,247,513,259,508,258,488,247,477,232,474,216,473,212,465,214,456,211,441,194,422,210,407,222,388,226,362,225,340,219,318,208,293,197,275,183,261,170,250,152,243" href="http://mercenarys.at.ua/forum/" />
   <area shape="poly" coords="670,313,680,303,687,283,697,267,697,176,739,233,746,241,764,242,784,251,805,268,819,296,823,307,836,323,844,333,845,342,836,352,848,365,856,368,857,374,847,383,839,378,838,369,819,346,810,362,797,377,785,386,770,434,763,455,764,470,775,480,782,489,777,495,765,495,750,487,737,489,736,472,735,464,742,452,745,423,751,423,760,395,743,394,736,416,731,430,720,458,722,468,720,489,712,489,709,495,696,499,684,498,683,491,690,484,692,468,701,455,707,428,716,411,724,390,705,377,706,397,699,393,693,399,691,393,692,378,680,382,681,373,686,367,680,367,685,359,688,349,673,345,678,331" href="#" />
   <area shape="poly" coords="513,338,520,324,518,317,552,232,590,226,630,230,639,238,676,333,668,350,673,395,678,401,678,409,684,431,684,440,693,445,688,454,676,442,682,457,681,466,670,464,664,444,663,467,658,472,650,465,652,447,644,452,646,430,649,416,643,412,624,426,638,445,634,469,667,481,675,505,665,514,641,515,613,510,596,506,595,491,619,449,614,439,606,432,596,434,581,432,566,448,582,481,588,494,588,504,583,511,566,515,554,516,534,518,519,516,519,506,523,485,538,480,548,474,554,471,548,452,551,436,559,425,548,415,541,422,542,433,537,457,530,471,522,466,509,471,507,464,518,453,504,456,492,452,494,445,509,444,515,420,514,408,517,404,520,374,520,345" href="http://mercenarys.at.ua/index/0-3" />
 <area shape="poly" coords="370,408,362,394,361,383,361,367,357,357,362,336,380,313,389,293,407,276,420,268,457,205,480,278,498,293,507,308,511,318,516,325,510,337,519,349,519,373,510,382,502,392,491,407,492,427,486,432,483,460,499,471,507,487,507,497,487,504,448,490,450,470,458,445,460,417,442,417,422,413,420,432,427,463,434,480,434,489,411,496,378,500,355,495,360,474,374,463,383,464,389,460,394,462,400,457,398,439,398,428,390,430,385,395,381,409" href="http://mercenarys.at.ua/forum/18-116-1" />
 <area shape="poly" coords="238,317,246,293,261,274,272,262,284,258,309,253,366,186,363,275,373,290,379,306,368,323,358,336,353,357,356,369,358,386,361,402,369,413,376,410,377,425,380,441,380,451,371,451,360,451,362,428,349,442,343,438,351,421,344,409,336,420,329,416,345,399,326,405,320,417,321,427,344,430,341,450,344,476,317,488,279,490,267,484,275,463,289,459,298,458,303,447,300,436,299,417,306,407,284,404,266,421,266,427,277,430,278,462,268,480,254,479,242,472,222,471,217,466,235,452,241,440,243,424,249,413,259,399,266,393,251,378,247,370,238,345" href="http://mercenarys.at.ua/board/" />
 </map>
 </a>
 
 
</div>
<div align="center">$POWERED_BY$
</div>
</body>
</html>

Автор: bars80080 21.4.2008, 16:56
сделать надо так:
Код
<style>
#base { position: relative; }
#reg_form { position: absolute; right: 0px; top: 0px; }
</style>

<div id="base" align="center"><a href="http://www." target="_blank"><img src="nabrosok-beta2.jpg" alt="" width="900" height="675" border="0" usemap="#Map" />
 <map name="Map" id="Map">
   <area shape="poly" coords="137,243,116,257,107,269,96,293,91,312,88,337,74,352,65,369,65,386,82,405,92,416,72,425,76,442,89,437,102,439,108,433,119,438,112,451,107,463,92,459,69,457,58,463,50,480,46,489,108,513,130,517,139,511,136,489,132,485,131,476,139,449,158,430,174,428,192,448,192,462,185,478,174,489,173,504,208,510,247,513,259,508,258,488,247,477,232,474,216,473,212,465,214,456,211,441,194,422,210,407,222,388,226,362,225,340,219,318,208,293,197,275,183,261,170,250,152,243" href="http://mercenarys.at.ua/forum/" />
   <area shape="poly" coords="670,313,680,303,687,283,697,267,697,176,739,233,746,241,764,242,784,251,805,268,819,296,823,307,836,323,844,333,845,342,836,352,848,365,856,368,857,374,847,383,839,378,838,369,819,346,810,362,797,377,785,386,770,434,763,455,764,470,775,480,782,489,777,495,765,495,750,487,737,489,736,472,735,464,742,452,745,423,751,423,760,395,743,394,736,416,731,430,720,458,722,468,720,489,712,489,709,495,696,499,684,498,683,491,690,484,692,468,701,455,707,428,716,411,724,390,705,377,706,397,699,393,693,399,691,393,692,378,680,382,681,373,686,367,680,367,685,359,688,349,673,345,678,331" href="#" />
   <area shape="poly" coords="513,338,520,324,518,317,552,232,590,226,630,230,639,238,676,333,668,350,673,395,678,401,678,409,684,431,684,440,693,445,688,454,676,442,682,457,681,466,670,464,664,444,663,467,658,472,650,465,652,447,644,452,646,430,649,416,643,412,624,426,638,445,634,469,667,481,675,505,665,514,641,515,613,510,596,506,595,491,619,449,614,439,606,432,596,434,581,432,566,448,582,481,588,494,588,504,583,511,566,515,554,516,534,518,519,516,519,506,523,485,538,480,548,474,554,471,548,452,551,436,559,425,548,415,541,422,542,433,537,457,530,471,522,466,509,471,507,464,518,453,504,456,492,452,494,445,509,444,515,420,514,408,517,404,520,374,520,345" href="http://mercenarys.at.ua/index/0-3" />
 <area shape="poly" coords="370,408,362,394,361,383,361,367,357,357,362,336,380,313,389,293,407,276,420,268,457,205,480,278,498,293,507,308,511,318,516,325,510,337,519,349,519,373,510,382,502,392,491,407,492,427,486,432,483,460,499,471,507,487,507,497,487,504,448,490,450,470,458,445,460,417,442,417,422,413,420,432,427,463,434,480,434,489,411,496,378,500,355,495,360,474,374,463,383,464,389,460,394,462,400,457,398,439,398,428,390,430,385,395,381,409" href="http://mercenarys.at.ua/forum/18-116-1" />
 <area shape="poly" coords="238,317,246,293,261,274,272,262,284,258,309,253,366,186,363,275,373,290,379,306,368,323,358,336,353,357,356,369,358,386,361,402,369,413,376,410,377,425,380,441,380,451,371,451,360,451,362,428,349,442,343,438,351,421,344,409,336,420,329,416,345,399,326,405,320,417,321,427,344,430,341,450,344,476,317,488,279,490,267,484,275,463,289,459,298,458,303,447,300,436,299,417,306,407,284,404,266,421,266,427,277,430,278,462,268,480,254,479,242,472,222,471,217,466,235,452,241,440,243,424,249,413,259,399,266,393,251,378,247,370,238,345" href="http://mercenarys.at.ua/board/ " />
 </map>
 </a>

<table id="reg_form" width="100%" height="55" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td align="right" height="25"><?if($USERS_ON$)?>
        <?if($USER_LOGGED_IN $)?>
      Ты зашёл как <a href="$PERSONAL_PAGE_LINK$"><b>$USERNAME$</b></a> | Группа "<u>$USER_GROUP$</u>"
      <?else?>
      Приветствую Вас <b>$USERNAME$</b>
      <?endif?>
      <?endif?>
      | <a href="$RSS_LINK$">RSS</a></td>
  </tr>
  <tr>
    <td align="right" height="18" valign="top"><a href="$HOME_PAGE_LINK$">Главная</a> | <a href="$PAGE_URL$">
      <?if($URI_ID$="page1")?>
      <?else?>
      $PAGE_NAME$
      <?endif?>
      </a>
        <?if($USERS_ON$)?>
      <?if($USER_LOGGED_IN$)?>
      | <a href="$PERSONAL_PAGE_LINK$">Мой профиль</a>
      <?else?>
      | <a href="$REGISTER_LINK$">Регистрация</a>
      <?endif?>
      <?endif?>
      <?if($USERS_ON$)?>
      <?if($USER_LOGGED_IN$)?>
      | <a href="$LOGOUT_LINK$">Выход</a>
      <?else?>
      | <a href="$LOGIN_LINK$">Вход</a>
      <?endif?>
      <?endif?></td>
  </tr>
</table>
 
</div>

что я сделал?
для слоя картинки назначил position: relative;, чтобы внутренние элементы ориентировались относительно этого слоя
для формы - position: absolute; right: 0px; top: 0px; чтоб она легла внутри справа

хочется заметить, код достаточно грязен и есть мусор: <tr><td valign="top"> - непонятно к чему, а также <a href="http://www." target="_blank"> - видимо остатки от чего-то

Добавлено через 1 минуту и 37 секунд
не стоило наверное, уж так точно описывать круглые формы эмэмдэмсов, хватило бы приближённого овала

Автор: ReDuX 21.4.2008, 17:05
ну не че не изменилось, картинку так же на легке можно сохранить((((
и еще в вашем коде шрифт сменился вот...


вот сижу и не могу эту панель управления опустить на картинку))) а то она как-то не в тему в углу))))

Автор: bars80080 21.4.2008, 17:31
ничего подобного, изменилось, замените теперь так:

Код

<style>
body { text-align: center; }
#base {  margin-left: auto; margin-right: auto;
    POSITION: relative; width: 900px; height: 675px;
}
#reg_form {
    RIGHT: 0px; POSITION: absolute; TOP: 0px; z-index: 10;
}
</style>

<div id="base" align="center"><a href="http://www." target="_blank"><img src="nabrosok-beta2.jpg" alt="" width="900" height="675" border="0" usemap="#Map" />
 <map name="Map" id="Map">
   <area shape="poly" coords="137,243,116,257,107,269,96,293,91,312,88,337,74,352,65,369,65,386,82,405,92,416,72,425,76,442,89,437,102,439,108,433,119,438,112,451,107,463,92,459,69,457,58,463,50,480,46,489,108,513,130,517,139,511,136,489,132,485,131,476,139,449,158,430,174,428,192,448,192,462,185,478,174,489,173,504,208,510,247,513,259,508,258,488,247,477,232,474,216,473,212,465,214,456,211,441,194,422,210,407,222,388,226,362,225,340,219,318,208,293,197,275,183,261,170,250,152,243" href="http://mercenarys.at.ua/forum/" />
   <area shape="poly" coords="670,313,680,303,687,283,697,267,697,176,739,233,746,241,764,242,784,251,805,268,819,296,823,307,836,323,844,333,845,342,836,352,848,365,856,368,857,374,847,383,839,378,838,369,819,346,810,362,797,377,785,386,770,434,763,455,764,470,775,480,782,489,777,495,765,495,750,487,737,489,736,472,735,464,742,452,745,423,751,423,760,395,743,394,736,416,731,430,720,458,722,468,720,489,712,489,709,495,696,499,684,498,683,491,690,484,692,468,701,455,707,428,716,411,724,390,705,377,706,397,699,393,693,399,691,393,692,378,680,382,681,373,686,367,680,367,685,359,688,349,673,345,678,331" href="#" />
   <area shape="poly" coords="513,338,520,324,518,317,552,232,590,226,630,230,639,238,676,333,668,350,673,395,678,401,678,409,684,431,684,440,693,445,688,454,676,442,682,457,681,466,670,464,664,444,663,467,658,472,650,465,652,447,644,452,646,430,649,416,643,412,624,426,638,445,634,469,667,481,675,505,665,514,641,515,613,510,596,506,595,491,619,449,614,439,606,432,596,434,581,432,566,448,582,481,588,494,588,504,583,511,566,515,554,516,534,518,519,516,519,506,523,485,538,480,548,474,554,471,548,452,551,436,559,425,548,415,541,422,542,433,537,457,530,471,522,466,509,471,507,464,518,453,504,456,492,452,494,445,509,444,515,420,514,408,517,404,520,374,520,345" href="http://mercenarys.at.ua/index/0-3" />
 <area shape="poly" coords="370,408,362,394,361,383,361,367,357,357,362,336,380,313,389,293,407,276,420,268,457,205,480,278,498,293,507,308,511,318,516,325,510,337,519,349,519,373,510,382,502,392,491,407,492,427,486,432,483,460,499,471,507,487,507,497,487,504,448,490,450,470,458,445,460,417,442,417,422,413,420,432,427,463,434,480,434,489,411,496,378,500,355,495,360,474,374,463,383,464,389,460,394,462,400,457,398,439,398,428,390,430,385,395,381,409" href="http://mercenarys.at.ua/forum/18-116-1" />
 <area shape="poly" coords="238,317,246,293,261,274,272,262,284,258,309,253,366,186,363,275,373,290,379,306,368,323,358,336,353,357,356,369,358,386,361,402,369,413,376,410,377,425,380,441,380,451,371,451,360,451,362,428,349,442,343,438,351,421,344,409,336,420,329,416,345,399,326,405,320,417,321,427,344,430,341,450,344,476,317,488,279,490,267,484,275,463,289,459,298,458,303,447,300,436,299,417,306,407,284,404,266,421,266,427,277,430,278,462,268,480,254,479,242,472,222,471,217,466,235,452,241,440,243,424,249,413,259,399,266,393,251,378,247,370,238,345" href="http://mercenarys.at.ua/board/ " />
 
<table id="reg_form" width="100%" height="55" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td align="right" height="25"><?if($USERS_ON$)?>
        <?if($USER_LOGGED_IN $)?>
      Ты зашёл как <a href="$PERSONAL_PAGE_LINK$"><b>$USERNAME$</b></a> | Группа "<u>$USER_GROUP$</u>"
      <?else?>
      Приветствую Вас <b>$USERNAME$</b>
      <?endif?>
      <?endif?>
      | <a href="$RSS_LINK$">RSS</a></td>
  </tr>
  <tr>
    <td align="right" height="18" valign="top"><a href="$HOME_PAGE_LINK$">Главная</a> | <a href="$PAGE_URL$">
      <?if($URI_ID$="page1")?>
      <?else?>
      $PAGE_NAME$
      <?endif?>
      </a>
        <?if($USERS_ON$)?>
      <?if($USER_LOGGED_IN$)?>
      | <a href="$PERSONAL_PAGE_LINK$">Мой профиль</a>
      <?else?>
      | <a href="$REGISTER_LINK$">Регистрация</a>
      <?endif?>
      <?endif?>
      <?if($USERS_ON$)?>
      <?if($USER_LOGGED_IN$)?>
      | <a href="$LOGOUT_LINK$">Выход</a>
      <?else?>
      | <a href="$LOGIN_LINK$">Вход</a>
      <?endif?>
      <?endif?></td>
  </tr>
</table>
</map>
 </a>

 
</div>


Добавлено через 1 минуту и 48 секунд
картинку вы полюбому защитить не сможете, раз пользователь её видет в своём браузере, значит она уже у него на компьютере

Автор: ReDuX 21.4.2008, 18:26
а почему работает без этих тегов
</div>
</body>
</html>
они разве не нужны? помойму я что-то недопонимаю

Автор: SelenIT 21.4.2008, 23:27
Цитата(ReDuX @  21.4.2008,  18:26 Найти цитируемый пост)
они разве не нужны?

В HTML (но не в XHTML) </body> и </html> http://www.w3.org/TR/html401/index/elements.html, браузер достраивает соответствующие элементы в DOM даже при отсутствии как закрывающих, так и открывающих тегов. Но лучше всегда их писать - как минимум для того, чтобы самому не запутаться.

Автор: ReDuX 22.4.2008, 07:44
что-то мне отвечают в других темах, наверно что-то сложное я спросил... плохо...

Автор: bars80080 22.4.2008, 10:14
Цитата(ReDuX @  21.4.2008,  18:26 Найти цитируемый пост)
а почему работает без этих тегов
</div>
</body>
</html>
они разве не нужны? помойму я что-то недопонимаю 

я просто не копировал остальное, конечно всю шапку и остальные закрывающие тэги желательно оставить

Автор: ReDuX 22.4.2008, 18:24
ок))) не могу бы ты мне в аську стукнуть??? ее номер 330331

Автор: bars80080 23.4.2008, 09:10
нет

Автор: ReDuX 23.4.2008, 12:31
 smile 

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)