Как сделать кнопку переключения с адаптивной версии на полную (пк) версию?

123
t1mkke
На сайте с 06.09.2012
Offline
82
#11

VoV@, там в футере для мелких экранов есть кнопка отключить адаптивный дизайн

VoV@
На сайте с 22.09.2007
Offline
196
#12

t1mkke, я дописал свой пост. Чуть не успел :)

⭐ Разработка Андроид-приложений (Xamarin C#). ⭐ Разработка ASP.NET (WebForms, MVC, WebAPI, Core). ⭐ Цой жив!
SeVlad
На сайте с 03.11.2008
Offline
1609
#13
flugerov:
Вот Вам пример pa.ua

там, если посмотреть внимательнее урл на переключатель другой - http://pa.ua/?s5_responsive_switch_paua=X.

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

Делаю хорошие сайты хорошим людям. Предпочтение коммерческим направлениям. Связь со мной через http://wp.me/P3YHjQ-3.
D.iK.iJ
На сайте с 26.05.2013
Offline
229
#14

Кнопка делается просто. Выносим всю адаптивную верстку, допустим, прямо в заголовок сайта или в отдельный файл.

Если нет определенной куки, показываем эти стили и мета тег, говорящий об адаптивности:

<? if (!isset($_COOKIE['nomobile'])){ ?>вызов файла CSS или сами стили<? } ?>

Дальше ставим куку через PHP или функцией javascript. У меня примерно так:

<a href="/" onclick="SetCookie('nomobile=on', '30');">Полная версия сайта</a>

Да, href="/" там нужен, по идее, для перезагрузки страницы. Можно заменить

Ну и скрипт ставящий куки:

//Куки
function SetCookie(id, days){
var ws=new Date();
ws.setDate((days-0+ws.getDate()));
document.cookie=id+"; path=/; expires="+ws.toGMTString();
}
Адаптивный дизайн в 2 строчки ( https://dikij.com/wm/adaptaciya-saytov.php ). + Принимаю заказы любой сложности ( https://searchengines.guru/ru/forum/926323 ). 💎 Еще я делаю классные кулоны с опалами ( https://mosaicopal.ru/ ).
F
На сайте с 19.03.2014
Offline
10
#15
DiKiJ:
Кнопка делается просто. Выносим всю адаптивную верстку, допустим, прямо в заголовок сайта или в отдельный файл.
Если нет определенной куки, показываем эти стили и мета тег, говорящий об адаптивности:


Дальше ставим куку через PHP или функцией javascript. У меня примерно так:
Да, href="/" там нужен, по идее, для перезагрузки страницы. Можно заменить


Ну и скрипт ставящий куки:

Адаптивная верстка в файле в responsive.css

Тут прописать пусть к файлу.

<? if (!isset($_COOKIE['nomobile'])){ ?>/templates/vt_emake/css/responsive.css<? } ?>

И потом эту строку, ссылку и скрипт прописать в index.php ?

t1mkke
На сайте с 06.09.2012
Offline
82
#16

flugerov, прописать нужно там, где сейчас подключается ваш файл, вот так: <? if (!isset($_COOKIE['nomobile'])){ ?><link rel="stylesheet" href="/templates/vt_emake/css/responsive.css"><? } ?>

F
На сайте с 19.03.2014
Offline
10
#17
t1mkke:
flugerov, прописать нужно там, где сейчас подключается ваш файл, вот так: <? if (!isset($_COOKIE['nomobile'])){ ?><link rel="stylesheet" href="/templates/vt_emake/css/responsive.css"><? } ?>

Запутался. Куда эту строку прописать?

K
На сайте с 03.06.2015
Offline
45
#18

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

MYSQL PHP JS HTML CSS SEO TXT США СССР
t1mkke
На сайте с 06.09.2012
Offline
82
#19

flugerov, там где у вас тег <head> и подключаются другие css. Если responsive.css уже подключается, то просто замените эту строку на ту, которая выше.

F
На сайте с 19.03.2014
Offline
10
#20
t1mkke:
flugerov, там где у вас тег <head> и подключаются другие css. Если responsive.css уже подключается, то просто замените эту строку на ту, которая выше.

Вот это все прописать в <head> ?

<? if (!isset($_COOKIE['nomobile'])){ ?><link rel="stylesheet" href="/templates/vt_emake/css/responsive.css"><? } ?>

<a href="/" onclick="SetCookie('nomobile=on', '30');">Полная версия сайта</a>

//Куки

function SetCookie(id, days){

var ws=new Date();

ws.setDate((days-0+ws.getDate()));

document.cookie=id+"; path=/; expires="+ws.toGMTString();

}

123

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий