Сообщений в теме: 31

[мистка]

скажите пожалуйста у меня в цветах нижнего и верхнего меню идет гардиент ,

• background: linear-gradient(to bottom, rgba(106, 130, 169, 0.44) 0%,rgba(106, 130, 169, 0.13) 20%,rgba(106, 130, 169, 0.97) 100%);
  
• border-radius: 60px 0px;

в мобильной версии не нижнее не верхнее меню , при добавлении класса все равно не появляется.

• background-color:linear-gradient(to bottom, rgba(106, 130, 169, 0.44) 0%,rgba(106, 130, 169, 0.13) 20%,rgba(106, 130, 169, 0.97) 100%);

как сделать менюшки видимыми в мобильной версии? именно гардиентом?? или это не реально?? если нет, то как на их место установить каринки, чтоб появлялись только в мобильной версиии и заменяли подсветку?
Аккаунт SL-299242

[Castiel]

тихоня (19 Август 2014 - 07:52) писал:

скажите пожалуйста у меня в цветах нижнего и верхнего меню идет гардиент ,

• background: linear-gradient(to bottom, rgba(106, 130, 169, 0.44) 0%,rgba(106, 130, 169, 0.13) 20%,rgba(106, 130, 169, 0.97) 100%);
  
  
• border-radius: 60px 0px;

в мобильной версии не нижнее не верхнее меню , при добавлении класса все равно не появляется.

• background-color:linear-gradient(to bottom, rgba(106, 130, 169, 0.44) 0%,rgba(106, 130, 169, 0.13) 20%,rgba(106, 130, 169, 0.97) 100%);

как сделать менюшки видимыми в мобильной версии? именно гардиентом?? или это не реально?? если нет, то как на их место установить каринки, чтоб появлялись только в мобильной версиии и заменяли подсветку?
Аккаунт SL-299242

Здравствуйте, в мобильной версии меню отображается теми цветами которые прописаны в стилях.

@media screen and (max-width: 640px)
.header {
background: linear-gradient(to bottom, rgba(12, 131, 197, 0.89) 0%,rgba(123, 216, 209, 0.94) 20%,rgba(21, 112, 172, 0.89) 100%);
}

[мистка]

в том и дело что нет, если я убераю из .header {background:rgba(106, 130, 196, 0.79); то оно вообще изчезнет в мобильной версии, а если убераю
background: linear-gradient(to bottom, rgba(106, 130, 169, 0.44) 0%,rgba(106, 130, 169, 0.13) 20%,rgba(106, 130, 169, 0.97) 100%);то из обычной версии
то есть этот стиль который вы показываете ни как не влияет.....прям ума не риложу что делать...











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

[Vaccina]

У вас прописано фон для мобильной версии,

.header {
	background: linear-gradient(to bottom, rgba(106, 130, 169, 0.44) 0%, rgba(106, 130, 169, 0.13) 20%, rgba(106, 130, 169, 0.97) 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
}

он более прозрачный, если его убрать, будет основной цвет отображаться

на счет меню, вы переносили его по какой-нибудь инструкции или самостоятельно?

[мистка]

меню переносила по инструкции ...(условно) задала вопрос и получила ответ
-----------------------------------------------------------------------------------------------------------------
что бы передвинуть меню в нижнюю часть монитора найдите в файле стилей код

.header {
position: absolute;
position: fixed;
top: 0;
left: auto;
z-index: 1024;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin-right: auto;
margin-left: auto;
min-width: 100%;
.....
....
....
.


И замените в нем строку с параметром

top: 0;

на строку

bottom:0;

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

[MikDark]

тихоня (20 Август 2014 - 08:22) писал:

меню переносила по инструкции ...(условно) задала вопрос и получила ответ
-----------------------------------------------------------------------------------------------------------------
что бы передвинуть меню в нижнюю часть монитора найдите в файле стилей код

.header {
position: absolute;
position: fixed;
top: 0;
left: auto;
z-index: 1024;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin-right: auto;
margin-left: auto;
min-width: 100%;
.....
....
....
.


И замените в нем строку с параметром

top: 0;

на строку

bottom:0;

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

Можно для мобильных версий оставить его наверху, это будет лучший вариант. Для этого в main.css ищем:

@media screen and (max-width: 980px) {

и после него вставляем:

.header {top:0;}

[мистка]

Спасибо за оперативный ответ! , скажите а цвета этой кнопочки где настроить) что то через поиск не находится ни как

[MikDark]

тихоня (20 Август 2014 - 08:29) писал:

Спасибо за оперативный ответ! , скажите а цвета этой кнопочки где настроить) что то через поиск не находится ни как

Там же есть код:

#js-btn-navbar {
		position: relative;
		display: block;
		float: left;
		padding: 0.1em 0em 0.4em 0em;
		width: 3.5em;
		height: 24px;
		border: 1px solid #8b5742;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
		background-color: #81ac15;
		color: #ffffff;
		text-align: center;
		line-height: 0.4;
		cursor: pointer;
	}

background-color - Это фоновый цвет, который сейчас зеленый.

[мистка]

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

[MikDark]

тихоня (20 Август 2014 - 08:59) писал:

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

Тогда в вышеприведенном коде поменяйте
position: relative;

на

position: fixed;
top: 0;

[мистка]

#js-btn-navbar {
    position: fixed;
        top: 0;
        display: block;
        float: left;
        padding: 0.1em 0em 0.4em 0em;
        width: 3.5em;
        height: 24px;
        border: 1px solid rgba(106, 130, 169, 0.97) 100%);
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        background-color: rgba(106, 130, 169, 0.97) 100%);
        color: #ffffff;
        text-align: center;
        line-height: 0.4;
        cursor: pointer;
    }

-----------------------
не поменялось и цвет тоже не поменяла кнопка...

[Castiel]

тихоня (20 Август 2014 - 09:25) писал:

#js-btn-navbar {
position: fixed;
top: 0;
display: block;
float: left;
padding: 0.1em 0em 0.4em 0em;
width: 3.5em;
height: 24px;
border: 1px solid rgba(106, 130, 169, 0.97) 100%);
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background-color: rgba(106, 130, 169, 0.97) 100%);
color: #ffffff;
text-align: center;
line-height: 0.4;
cursor: pointer;
}

-----------------------
не поменялось и цвет тоже не поменяла кнопка...

У вас не правильно указан цвет
Должно быть так

background-color: rgba(106, 130, 169, 0.97);

[мистка]

ну цвет ладно, а кнопочка?

[Castiel]

тихоня (20 Август 2014 - 09:37) писал:

ну цвет ладно, а кнопочка?

Приведите пример на скриншоте того как все это должно выглядеть.

[MikDark]

тихоня (20 Август 2014 - 09:37) писал:

ну цвет ладно, а кнопочка?

Кнопка меню у Вас теперь наверху. Почистите кэш.

[мистка]

она вверху но и корзина переехала
вот как сейчас а справо картинка как нужно в итоге, спасибо)

[Castiel]

тихоня (20 Август 2014 - 09:54) писал:

она вверху но и корзина переехала
вот как сейчас а справо картинка как нужно в итоге, спасибо)

Безымянный.png

В main.css
Удалите

@media screen and (max-width: 980px)
.header {
top: 0;
}

[мистка]

это разрывает в клочья весь шаблон...............я решила эту проблему просто сделала прозрачным цвет в мобильной версии )

[MikDark]

тихоня (20 Август 2014 - 10:16) писал:

это разрывает в клочья весь шаблон...............я решила эту проблему просто сделала прозрачным цвет в мобильной версии )

Только этот участок нужно было удалить из кода выше:

.header {
top: 0;
}

[мистка]

аа..ща попробую
спасибо!!!!!!!!!!!