сползают вниз баннеры в шаблоне Kitchen, с мобильной версии

[yep-shop.ru]

Если поставить в шаблоне Kitchen 3 банера, 2 располагаются в text_header_top + 1 слайдшоу: посередине (прикрепил картинку), то когда заходишь с мобильной версии банеры выстраиваются в столбик. Возможно сделать, чтобы с компа показывалось 3 банера, а с телефона только одно слайдшоу?

[admin]

конечно возможно

для этого есть такая штука как медиаквери

погуглите на этот счет

идея там такая что в стилях в зависимости от размера экрана меняем свойство дисплей блок на дисплей нон

ну вообще можно любой элемент менять ширину высоту цвет да что угодно

[yep-shop.ru]

конечно возможно

для этого есть такая штука как медиаквери

погуглите на этот счет

идея там такая что в стилях в зависимости от размера экрана меняем свойство дисплей блок на дисплей нон

ну вообще можно любой элемент менять ширину высоту цвет да что угодно

я понял, что такое media queries, но не пойму какой код взять, так как встретил разные коды, и куда этот код вставить тоже не пойму. ведь можно же просто вставить этот код, скорее всего в стили, я правильно понял?

один из примеров кода: 

" /* Smartphones (portrait and landscape) */

@media only screen

and (min-device-width : 320px)

and (max-device-width : 480px) {

/* Styles or @import */

}

/* Smartphones (landscape) */

@media only screen

and (min-width : 321px) {

/* Styles or @import */

}

/* Smartphones (portrait) */

@media only screen

and (max-width : 320px) {

/* Styles or @import */

}

/* iPads (portrait and landscape) */

@media only screen

and (min-device-width : 768px)

and (max-device-width : 1024px) {

/* Styles or @import */

}

/* iPads (landscape) */

@media only screen

and (min-device-width : 768px)

and (max-device-width : 1024px)

and (orientation : landscape) {

/* Styles or @import */

}

/* iPads (portrait) */

@media only screen

and (min-device-width : 768px)

and (max-device-width : 1024px)

and (orientation : portrait) {

/* Styles or @import */

}

/* Desktops and laptops */

@media only screen

and (min-width : 1224px) {

/* Styles or @import */

}

/* HD screens */

@media only screen

and (min-width : 1824px) {

/* Styles or @import */

}

/* Retina displays */

@media only screen and (-webkit-min-device-pixel-ratio : 1.5),

only screen and (min-device-pixel-ratio : 1.5) {

/* Styles or @import */

}"

[admin]

какой ширины надо той и берите

[yep-shop.ru]

а куда этот код вставлять? не понимаю как и куда вставляются коды. у меня было предположение,что надо в stylesheet, где-то в .banner

[admin]

этот код никуда вставлять не нужно

нужно сделать свой именно для того элемента для которого нужно

если речь идет про баннер то опишите поведение для баннер что он должен делать при той или иной ширине

[yep-shop.ru]

этот код никуда вставлять не нужно

нужно сделать свой именно для того элемента для которого нужно

если речь идет про баннер то опишите поведение для баннер что он должен делать при той или иной ширине

к сожалению я в этом, надеюсь пока, далек. так что понять как правильно написать код и куда его вставить не понимаю :-) 

[admin]

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

[yep-shop.ru]

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

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

[admin]

в стильшит :-)

в самом низу пишите что то типа

@media only screen

and (max-width : 320px) {

.banner {display: none;}

}

@media only screen

and (min-width : 321px) {

.banner {display: block;}

}

[yep-shop.ru]

все конечно работает,как и хотелось. в интернете находил подобие, но разобраться так и не получилось. теперь понятно, спасибо :-)

[admin]

теперь то надеюсь разобрались ?

[yep-shop.ru]

чтобы что-то не показывалось да :-)

[admin]

:-) ну любой стиль можно задать в зависимости от размера экрана ширину высоту цвет позицию да что угодно

[yep-shop.ru]

:-) ну любой стиль можно задать в зависимости от размера экрана ширину высоту цвет позицию да что угодно

я только одно не понял, зачем задавать код для двух экранов? просто думал,что необходимо задать условие только для разрешения телефона и будет все работать как и хотелось. из-за условия решил что это два разрешения

[admin]

затем что стиль должен быть и там и там

[yep-shop.ru]

затем что стиль должен быть и там и там

спасибо,ценная информация :-)