Форум

Alexodiy · #1 (**permalink**) 24.08.2018, 00:50

Доброго времени суток. Возник такой вопрос...

В head:

<meta name="viewport" content="width=device-width, initial-scale=1">

Задача - по клику на:

<a href="#" class="viev_main">отключить адаптив</a>

изменить атрибут мета вьюпорта на:

<meta name="viewport" content="width=1200px">

но и при повторном клике по .viev_main (отключить адаптив), возвращать content="width=device-width, initial-scale=1" .

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

j0hnik · #2 (**permalink**) 24.08.2018, 07:41

Только зачем вам эти роги нужны?

<!DOCTYPE html>
	<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>Document</title>
		<meta name="viewport" content="width=device-width, initial-scale=1">
	</head>
	<body>
		<a href="#" class="viev_main">отключить адаптив</a>
		<script>
			
			var viewport = document.querySelector('[name="viewport"]'),
			link = document.querySelector('.viev_main');
			if(localStorage.getItem('viewport')){
				viewport.content = localStorage.getItem('viewport');
				link.textContent  = localStorage.getItem('link');
			}

			link.onclick = function(){
				if(viewport.content == "width=1200px") {
					viewport.content = "width=device-width, initial-scale=1";
					this.textContent = 'отключить адаптив';
					localStorage.setItem('viewport', "width=device-width, initial-scale=1");
					localStorage.setItem('link', 'отключить адаптив');
				}
				else{
					viewport.content = "width=1200px";
					this.textContent = 'включить адаптив';
					localStorage.setItem('viewport', "width=1200px");
					localStorage.setItem('link', 'включить адаптив');
				}
			};

		</script>
	</body>
	</html>

Alexodiy · #3 (**permalink**) 24.08.2018, 09:54

Сообщение от j0hnik

Только зачем вам эти роги нужны?

Огромное спасибо за помощь. По поводу того, зачем? Не хотелось бы матом ругаться на данном форуме, я понимаю что ерунда полная

Форум

Справочник

Discord чат

Курсы javascript