ola
-
Posts
9 -
Joined
-
Last visited
ola's Achievements
Explorer (1/14)
0
Reputation
-
Начинающий веб-разработчик, для пополнения своего портфолио сделаю сайт бесплатно. Система управления сайтом - джумла. Skype: olga121985
-
Ура! спасибо большое)
-
Решила попробовать карты) вот только не понимаю как я могу увидеть как же они работают!? Вот код: <img src="img/moto.jpg" width="459" height="377" alt="мотик"> <map name="moto"> <area shape="rect" coords="0,0,200,200" href="http://htmlbook.ru" alt="ссылка1" title="ссылка1"> <area shape="rect" coords="200,200,400,0" href="http://htmlbook.ru" alt="ссылка2" title="ссылка2"> <area shape="rect" coords="0,200,200,400" href="moscow.html" alt="ссылка3" title="ссылка3"> <area shape="rect" coords="200,200,400,400" href="piter.html" alt="ссылка4" title="ссылка4"> </map> никакого CSS у меня нету (может нужен?). Я ожидаю, что на моей прямоугольной картинке будет 4 области, которые при наведении мышкой будут "лапкой" выделяться (как ссылки). Ни чего подобного нет - просто картинка, обычная стрелочка от мыши.
-
-
здорово) но в фотошопе я свою окружность по всей видимости не порежу, попробую какой-нибудь другой редактор...
-
Flash, боюсь, не осилю( Т.е. вы предлагаете использовать <map> , правильно? А может нарезка возможна в каком-то дугом графич.редакторе? делают же это как-то!?
-
А для того, чтобы спозиционировать , ведь нужно на резать на 6 кусочкков мою окружность. Как это можно сделать не подскажите? я с фотошопом весь день борюсь не получается. Не знаю как.
-
Направьте верным путем. Хочу попробовать сделать макет, внешне похожий на этот http://www.free-lance.ru/users/somnambula/...hp?prjid=474595 Только в окружности у меня находится одна картинка, которую хочу разбить по секторам (6 штук). Из каждого сектора выходит "стрелочка-указатель" с названием меню. При нажатии на один из пунктов меню и на один из секторов (желательно чтобы он "загорался", например, становился ярче). Думаю, есть вариант реализовать это с помощью CSS. Тогда надо картинку нарезать, а как не знаю, на прямоугольники понятно как...а на треугольники как? (вернее сектора). Или с помощбю карт это можно сделать..?
-
верстаю меню по готовому примеру: http://blog.sjinks.pro/css/53-cross-browse...out-javascript/ я - новичок и , пожалуй, упускаю многие вещи. Просьба проверить мой код: 1. активное (class="on") подменю видно под нужным подменю (при наедении на верхнее). z-index лишь отчасти помогает 2. не получается разделить стили для верхнего меню и ниж. подменю (нижнее нужно расположить каким-то образом, чтобы оно не переносилось на другую строку) 3. самое главное сомнение. будет ли это меню работать, поскольку пока, в тестовом режиме, мне не удается поймать мышкой подменю. Может еще что добавить? <body> <div id="frame"> <div id="header"> <div id="logo"></div> <div id="menu_info"></div> </div> <ul id="menu"> <li> <a href="#"><center class="orange">Паевые фонды</center><!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tbody><tr><td><![endif]--> <ul class="smenu"> <li><a href="#">Информация</a></li> <li><a href="#">Статистика</a></li> <li><a href="#">Отчетность</a></li> <li><a href="#">Документы</a></li> <li><a href="#">Реквизиты</a></li> </ul> <!--[if lte IE 6]></td></tr></tbody></table></a><![endif]--> </li> <li> <a href="#"><center class="orange">Клиентам</center><!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tbody><tr><td><![endif]--> <ul id="submenu"> <li><a href="#">Продать паи</a></li> <li><a href="#">Обменять паи</a></li> </ul> <!--[if lte IE 6]></td></tr></tbody></table></a><![endif]--> </li> <li> <a href="#"><center class="orange">О компании</center><!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tbody><tr><td><![endif]--> <ul> <li><a href="#">Официальная отчетность</a></li> <li><a href="#">Лицензии</a></li> <li><a href="#">Реквизиты</a></li> </ul> <!--[if lte IE 6]></td></tr></tbody></table></a><![endif]--> </li> <br> <li> <a href="#"><center>Статистика и анализ</center><!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tbody><tr><td><![endif]--> <ul> <li><a href="#">Отчетность</a></li> <li><a href="#">аналитика</a></li> <li><a href="#">прогнозы</a></li> </ul> <!--[if lte IE 6]></td></tr></tbody></table></a><![endif]--> </li> <li class="on"> <a href="#"><center>Начинающим инвесторам</center><!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tbody><tr><td><![endif]--> <ul> <li><a href="#">Операции с паями</a></li> <li><a href="#">Налогообложение</a></li> </ul> <!--[if lte IE 6]></td></tr></tbody></table></a><![endif]--> </li> <li> <a href="#"><center>Официальная отчетность</center><!--[if IE 7]><!--></a><!--<![endif]--> <!--[if lte IE 6]><table><tbody><tr><td><![endif]--> <ul class="smenu"> <li><a href="#">О компании</a></li> <li><a href="#">Отчетность</a></li> <li><a href="#">Лицензии</a></li> <li><a href="#">Реквизиты</a></li> </ul> <!--[if lte IE 6]></td></tr></tbody></table></a><![endif]--> </li> </ul> <div id="container"></div> </body> * obshie stili */ * { margin: 0; padding: 0; } html { width: 100%; height: 100%; min-height: 100%; } body { font: 16px/26px Book Antiqua, Arial, Tahoma, Verdana, sans-serif; width: 100%; height: 100%;/*for IE*/ min-height: 100%; background-color:#fff; position: relative; overflow: auto; } #frame { width: 1000px; margin: 0 auto; height: auto !important; height: 100%; /* для IE6 */ min-height: 100%; } * html #frame{ height:100%; } #header { width: 1000px; height: 63px; margin-top: 15px; } /* stili menu */ #menu_info { margin-left: 207px; width: 793px; height: 62px; border-bottom: 1px rgb(241,174,47) solid; } #menu .smenu a { float: left; vertical-align: middle; padding: 0 .5em; width: 160px; color: #163e70; } #menu li.smenu ul { position: absolute; left: -100px; } #menu, #menu li, #menu ul { list-style: none; margin: 0; padding: 0; } #menu ul { text-align: center; } #menu { display: block; width: 100%; position: relative; left: 207px; /* убрать надо будет потом!!! */ top:-62px; /* убрать надо будет потом!!! */ } #menu li { float: left; height: 2em; line-height: 2em; } /* verh */ #menu li a { float: left; vertical-align: middle; padding: 0 .5em; width: 250px; color: #163e70; } #menu li ul { display: none; position: absolute; top: 2em; left: 0; margin-top: 40px; width: 100%; background: #FFF; height: auto; } #menu li.on ul, #menu li:hover ul { display: block; z-index: 10; } #menu li:hover ul { z-index: 100; } #menu li li a { display: block; border: 1px solid #f1ae2f; vertical-align: middle; padding: 0 .5em; margin-right: 10px; background-color: #f6f5f5; /* bez background menu nakladivaetsya t.e. po suti - nakladivaetsya !!!!!!!!! */ } #menu > li + li { margin-left: -1px; } #menu li ul li + li { margin-left: -1px; } #menu li a { outline: 0; text-decoration: none; } #menu li.on { font-weight: bold; } /*#menu li:hover a #menu li a:hover a*/ #menu li a:hover { color: #f1ae2f; } /*#menu li ul li:hover*/ #menu li ul li a:hover { background: #fff; }