chaica12

горизонтальное меню

Рекомендуемые сообщения

chaica12    0

Всем привет! столкнулся с такой проблемкой. когда в ходишь на сайт по урлу http://photodesign.ru то кнопки горизонтального меню все одинакового цвета, хотя должна кнопка под названием "Главная" быть выделена другим цветом, а если на нее нажать, то цвет меняется. Причину я выяснил:

На сайт я захожу по урлу http://photodesign.ru

А если нажать кнопку Главная, то урл изменяется на такой http://photodesign.ru/index.php?route=common/home

т.е.

<ul class="tmenu">

<li><a href="<?php echo str_replace('&', '&', $home); ?>" id="tab_home"><?php echo $text_home; ?></a></li>

изменяет цвет тольк при условии

$(document).ready(function() {

route = getURLVar('route');

if (!route) {

//$('#tab_home').addClass('selected');

} else {

part = route.split('/');

if (route == 'common/home') {

$('#tab_home').addClass('selected');

помогите пожалуста поправить код, чтоб при заходе на сайт по урлу http://photodesign.ru кнопка Главная сразу была другого цвета

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
chaica12    0

всем спасибо, задача решена)))

надо было изменить код след оброзом

<ul class="tmenu">

<li><a href="<?php echo str_replace('&'); ?>" id="tab_home"><?php echo $text_home; ?></a></li>

и тут

$(document).ready(function() {

route = getURLVar('route');

if (!route) {

$('#tab_home').addClass('selected');

} else {

part = route.split('&');

if (route == '&') {

$('#tab_home').addClass('selected');

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
Digger174    4

Подскажите пожалуйста как изменить вид кнопки?

Например "Поиск"

Хочу сделать кнопку в фотошопе и залить ее на сайт.

Заранее спасибо!

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
gdi31    5

Есть сайт, есть простое горизонтальное меню, есть два примера (первый / второй) как бы мне хотелось это видеть у себя, но нет того решения как всё это победить. Может, есть среди форумчан тот человек, у которого это, уже позади или для которого это, два пальца… Изображение

Буду признателен любой помощи.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
Smallbear    79

Есть сайт, есть простое горизонтальное меню, есть два примера (первый / второй) как бы мне хотелось это видеть у себя, но нет того решения как всё это победить. Может, есть среди форумчан тот человек, у которого это, уже позади или для которого это, два пальца… Изображение

Буду признателен любой помощи.

вы хотите просто чтобы пункты меню подсвечивались снизу когда на них мышь наводится?

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

попробуйте в css покапайтесь,это не должно быть сложно,только заранее подберите картинку

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
gdi31    5

попробуйте в css покапайтесь,это не должно быть сложно,только заранее подберите картинку

Ясней не стало :) , ну всё равно СПАСИБО!

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
afwollis    1 097

как по мне, так у них это сделано ужасно...

#navbar { height: 21px; float: left; width: 680px; margin: 20px 0px 0px 24px; }
#navbar #nav { background: url(../images/nav.png) no-repeat; height: 21px; width: 591px; position: relative; border: 0px solid red; }
#navbar #nav span { text-indent: -9999px; display: block; }
#navbar #nav li, #nav a { display: block; height: 36px; outline: none; }
#navbar #nav li { float: left; list-style: none; outline: none; }
#navbar #nav-1 { width: 63px; }
#navbar #nav-2 { width: 108px; }
#navbar #nav-3 { width: 132px; }
#navbar #nav-4 { width: 152px; }
#navbar #nav-5 { width: 136px; }
#navbar #nav-1 #nav-1-line, #nav-1-noline a:hover { background: url(../images/nav.png) -0px -21px no-repeat; }
#navbar #nav-2 #nav-2-line, #nav-2-noline a:hover { background: url(../images/nav.png) -63px -21px no-repeat; }
#navbar #nav-3 #nav-3-line, #nav-3-noline a:hover { background: url(../images/nav.png) -171px -21px no-repeat; }
#navbar #nav-4 #nav-4-line, #nav-4-noline a:hover { background: url(../images/nav.png) -303px -21px no-repeat; }
#navbar #nav-5 #nav-5-line, #nav-5-noline a:hover { background: url(../images/nav.png) -455px -21px no-repeat; }

_ttp://www.gamesforherbyyou.com/images/nav.png
Изображение

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
gdi31    5

как по мне, так у них это сделано ужасно...

Может есть вариант как всё это сделать прилично.

Был бы очень признателен.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
gdi31    5

как по мне, так у них это сделано ужасно...

#navbar { height: 21px; float: left; width: 680px; margin: 20px 0px 0px 24px; }
#navbar #nav { background: url(../images/nav.png) no-repeat; height: 21px; width: 591px; position: relative; border: 0px solid red; }
#navbar #nav span { text-indent: -9999px; display: block; }
#navbar #nav li, #nav a { display: block; height: 36px; outline: none; }
#navbar #nav li { float: left; list-style: none; outline: none; }
#navbar #nav-1 { width: 63px; }
#navbar #nav-2 { width: 108px; }
#navbar #nav-3 { width: 132px; }
#navbar #nav-4 { width: 152px; }
#navbar #nav-5 { width: 136px; }
#navbar #nav-1 #nav-1-line, #nav-1-noline a:hover { background: url(../images/nav.png) -0px -21px no-repeat; }
#navbar #nav-2 #nav-2-line, #nav-2-noline a:hover { background: url(../images/nav.png) -63px -21px no-repeat; }
#navbar #nav-3 #nav-3-line, #nav-3-noline a:hover { background: url(../images/nav.png) -171px -21px no-repeat; }
#navbar #nav-4 #nav-4-line, #nav-4-noline a:hover { background: url(../images/nav.png) -303px -21px no-repeat; }
#navbar #nav-5 #nav-5-line, #nav-5-noline a:hover { background: url(../images/nav.png) -455px -21px no-repeat; }

_ttp://www.gamesforherbyyou.com/images/nav.png
Изображение

Не очень понятно, верней не совсем ясно, то есть совсем не понятно...

Это ответ на мой вопрос, или информация к размышлению?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
gdi31    5

Есть такое горизонтальное меню, но к этому меню есть вопрос: как это меню можно абсолютно выровнять по вертикали и горизонтали?

День делов, но выровнять абсолютно так и не смог. (если даделаю попробую выложить)

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
Smallbear    79

Есть такое горизонтальное меню, но к этому меню есть вопрос: как это меню можно абсолютно выровнять по вертикали и горизонтали?

День делов, но выровнять абсолютно так и не смог. (если даделаю попробую выложить)

а что это значит?должно расстягиваться под окно браузера?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
kopaweb19    14

Зделать такое проблем нет. Все делается с помощью hover. Могу помочь, только вот непонимаю как оно должно выглядеть.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
gdi31    5

а что это значит?должно расстягиваться под окно браузера?

1-й ? - не понятно, 2-й ? - тем более.

Общение просто супер!

Я на закадированном не понимаю, мне если ложка, значить естьИзображение,

если водка значить питьИзображение,

про окно браузера недавно узнал, так что извините «Моя твоя не понимать».

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
gdi31    5

Зделать такое проблем нет. Все делается с помощью hover. Могу помочь, только вот непонимаю как оно должно выглядеть.

Сейчас всё выглядит вот так:

Изображение

Хочу привести к такому виду:

Изображение

Красным выделен - header_1_center.png.

Синим выделено - моё меню.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
Smallbear    79

попробуйте в div4 в css (div4 поидее отвечает за горизонтальное меню,но т.к. Вы могли что менять,возможно у Вас другой стиль за него отвечает) дописать padding-top: 14px; или margin-top: 14px; вместо 14 подставьте что Вам нужно.

Но Ваши кнопки соцсетей сьедут вниз

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
gdi31    5

попробуйте в div4 в css (div4 поидее отвечает за горизонтальное меню,но т.к. Вы могли что менять,возможно у Вас другой стиль за него отвечает) дописать padding-top: 14px; или margin-top: 14px; вместо 14 подставьте что Вам нужно.

Но Ваши кнопки соцсетей сьедут вниз

Спасибо за совет, вот только у меня такие ДИВЫ не водятся!

Зато обитает маленькой ОТРЫВОК, над которым произвожу эксперимент методом ТЫКА, по горизонтали вроде научился рулить, а вот повертикали пока в процессе . . .

Место где провожу маневры:

#MainMenu

{

background:#626262;

border:0;

margin:0;

}

#tab

{

top:0;

height:0;

background:repeat-x top;

margin:0 auto;

width:785px;

}

#tab ul

{

list-style:none;

float:left;

margin:0;

padding:0;

}

#tab li

{

display:inline;

float:left;

margin:0 2px;

padding:0;

}

#tab a

{

background:#626262 url(../image/bright_099.png) no-repeat right top;

text-decoration:none;

border:0;

display:block;

float:left;

margin:0;

padding:0;

}

#tab a span

{

display:block;

background:url(../image/bleft_099.png) no-repeat left top;

font-family:Tahoma, Arial, Helvetica, sans-serif;

font-size:14px;

color:#ffffff;

font-weight:700;

line-height:31px;

padding:0 13px;

}

#tab a:hover,#tab li.item_active a

{

background-position:right bottom;

border-color:#626262;

}

#tab a:hover span,#tab li.item_active a span

{

background-position:left bottom;

color:#ffffff;

font-weight:700;

font-style:normal;

text-decoration:none;

}

.dropmenudiv,.dropmenudiv ul,.dropmenudiv li ul

{

position:absolute;

top:0;

float:left;

display:block;

visibility:hidden;

border:0 #626262;

background:#626262;

color:#ffffff;

z-index:100;

text-decoration:none;

margin:0;

padding:0;

}

.dropmenudiv ul

{

list-style:none;

margin:0;

padding:0;

}

.dropmenudiv li

{

list-style:none;

margin:0;

padding:0;

}

.dropmenudiv a:link,.dropmenudiv a:visited

{

width:180px;

display:block;

border:0 #626262;

color:#ffffff;

background:url(../image/bleft_099.png) no-repeat left top;

font-weight:700;

font-style:normal;

text-decoration:none;

margin:0 2px;

padding:0;

}

.dropmenudiv a span

{

display:block;

line-height:31px;

background:url(../image/bright_099.png) no-repeat right top;

font-family:Tahoma, Arial, Helvetica, sans-serif;

font-size:14px;

color:#ffffff;

float:none;

padding:0 13px;

}

.dropmenudiv a:hover

{

border:0 #626262;

background-position:left bottom;

font-weight:700;

font-style:normal;

text-decoration:none;

color:#ffffff;

}

.dropmenudiv a:hover span

{

background-position:right bottom;

color:#ffffff;

font-weight:700;

}

Одна надежда на АССА, который всё разрулит. Изображение

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
kopaweb19    14

Смотри:

В файле css находиш #header_panel {. Там висоту всех рисунков (header_1.png - header_6.png) редактируеш з 32 на 40. Тоисть, если было:

#header_panel .panel_top .left {
background : url(header_1.png) no-repeat;
width : 5px;
height : 32px;
float : left;

Меняеш на:

#header_panel .panel_top .left {
background : url(header_1.png) no-repeat;
width : 5px;
height : 40px;
float : left;

И так все шесть. Картинки у тебя итак висотой 40, если нужно чтоб было выше, нужно перерисовать картинки.

Потом находиш

#tab ul 
{
list-style:none;
float:left;
margin:0;
padding:0;
 }

меняеш на:

#tab ul 
{
list-style:none;
float:left;
margin:0;
margin-top:7px;
padding:0;
}

Вроде у меня все так получилось как ты хотел)

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
gdi31    5

Смотри . . . Вроде у меня все так получилось как ты хотел)

ОГРОМАДНОЕ СПАСИБЕЩЕ!!! Изображение

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
gdi31    5

В посте №10 обещал, как доделаю, выложу, но тут подумал и решил, что изобретать велосипед, если он уже есть.

Берите и катайтесь! Изображение

P.S. Я потратил два дня с большими перекурами, чтобы обкатать, этот велик.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти


  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу