Модераторы: Illuminaty
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Создание навигации, Недопонимаю... 
:(
    Опции темы
Miako
Дата 19.5.2009, 20:59 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 5
Регистрация: 19.5.2009

Репутация: нет
Всего: нет



Разъясните плз такой момент:
Нарисовал я например навигацию сайта в фотошопе,т.е. получилась картинка с текстом(будущими ссылками).
Как потом сделать из этого нарисованного текста те самые ссылки?
PM MAIL   Вверх
bars80080
Дата 19.5.2009, 22:30 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прапор творюет
****
Награды: 1



Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 50
Всего: 315



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


почитать можно хотя бы здесь: http://stepbystep.htmlbook.ru/?id=1
PM MAIL WWW   Вверх
Miako
Дата 19.5.2009, 22:40 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 5
Регистрация: 19.5.2009

Репутация: нет
Всего: нет



Понятия я эти знаю,я же именно поэтому и написал что бы помогли сделать ссылки.Я так понял,что придется в фотошопе ничего не заполнять,т.е. оставлять место для ссылок пустыми,а уже потом непосредственно вставлять ссылки на эти места?
PM MAIL   Вверх
bars80080
Дата 20.5.2009, 10:12 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прапор творюет
****
Награды: 1



Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 50
Всего: 315



всё зависит от конкретной задачи и от мысли верстальщика. к примеру, совершенно не сложно сделать одной картинкой. надо всего лишь почитать про карты map и области ссылок <area>
в этом случае мы можем просто определить для разных частей картинки разные ссылки
PM MAIL WWW   Вверх
Miako
Дата 20.5.2009, 16:34 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 5
Регистрация: 19.5.2009

Репутация: нет
Всего: нет



К примеру такое простенькое меню:

user posted image
PM MAIL   Вверх
bars80080
Дата 20.5.2009, 18:03 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прапор творюет
****
Награды: 1



Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 50
Всего: 315



а причём здесь картинки? тут нужна всего одна - задний фон, а ссылки - текстовые, самые обычные
PM MAIL WWW   Вверх
Miako
Дата 20.5.2009, 23:47 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 5
Регистрация: 19.5.2009

Репутация: нет
Всего: нет



Так ,что то я запутался smile 
Допустим задний фон есть,монотонный.А откуда остальное возьмется?CSS?
Почитал про мапы и ареа...вроде все понятно,берешь картинку и указываешь какие ее области будут ссылкой.Непонятно только как реализовать анимацию нажатия на ссылку.
PM MAIL   Вверх
bars80080
Дата 21.5.2009, 00:58 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прапор творюет
****
Награды: 1



Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 50
Всего: 315



в данном случае никаких областей с картами


Код

<div id="menu">
<a href="http://server.ru/link1">Home</a>
<a href="http://server.ru/link1">Blog</a>
<a href="http://server.ru/link1">Photoshop</a>
....
</div>



и стили:

Код

* { margin: 0px; padding: 0px; }
#menu { width: 200px; height: 400px; background: url(fon.jpg) no-repeat; padding: 30px 10px; }
#menu a { display: block; width: 180px; height: 20px; font: 10pt Tahoma; color: #dddddd; }
#menu a:hover { color: #ffffff; }
в принципе этого должно хватить


Это сообщение отредактировал(а) bars80080 - 21.5.2009, 00:59
PM MAIL WWW   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »


 




[ Время генерации скрипта: 0.0489 ]   [ Использовано запросов: 21 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.