Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 03.11.2016, 19:39
Новичок на форуме
Отправить личное сообщение для Hinc Посмотреть профиль Найти все сообщения от Hinc
 
Регистрация: 03.11.2016
Сообщений: 2

Изменить содержимое div при смене размера экрана - JavaScript
Приветствую.
Пробую создать адаптивный сайт. Есть уже. Но вот хэдэр сайта у меня fixed и со смартфона смотрится ужасно.

Можете ли вы мне написать код, который будет удалять текст с div при разрешении (ширине) экрана в 720px и будет возвращать тот текст, если ширина экрана стала большей?

Пример того, что я сам искал и пробовал, но ничего не получилось.


<script type=text/javascript>
 
    $(window).resize(function() {
  if(document.documentElement.clientWidth < 721) {
   document.getElementByID("buy").innerHTML='<a href="#buy"> <div class="header_button_active"> <span class="segoe">о…Ќ</span> </div> </a>';
  }
});
 
</script>


<div id="buy"> <a href="#buy"> <div class="header_button_active"> <span class="segoe">о…Ќ</span> <span class="bold"> Купить </span> </div> </a> </div>


Нужно чтобы:
если ширина экрана меньше 721, то с div id="buy" удаляется весь текст и теги кроме:
<a href="#buy"> <div class="header_button_active"> <span class="segoe">о…Ќ</span> </div> </a>


То, что кроме - это нужно оставить.
если ширина экрана больше 721 то, div id="buy" должен быть с таким текстом и тегами:
<div id="buy"> <a href="#buy"> <div class="header_button_active"> <span class="segoe">о…Ќ</span> <span class="bold"> Купить </span> </div> </a> </div>


Помогите пожалуйста.
Ответить с цитированием
  #2 (permalink)  
Старый 03.11.2016, 20:09
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

http://javascript.ru/blog/andrej-par...enta-elementov
Ответить с цитированием
  #3 (permalink)  
Старый 03.11.2016, 21:05
Новичок на форуме
Отправить личное сообщение для Hinc Посмотреть профиль Найти все сообщения от Hinc
 
Регистрация: 03.11.2016
Сообщений: 2

Я не силен в js, помогите кодом, если можно.
Ответить с цитированием
  #4 (permalink)  
Старый 08.11.2016, 06:12
Интересующийся
Отправить личное сообщение для Gowa Посмотреть профиль Найти все сообщения от Gowa
 
Регистрация: 17.04.2016
Сообщений: 11

$(window).resize(function() {
	if (($(window).width() < 721 + 'px') {
		$( '#buy' ).html('<a href="#buy"> <div class="header_button_active"> <span class="segoe">о…Ќ</span> </div> </a>');
	else {
		$( '#buy' ).html('<a href="#buy"> <div class="header_button_active"> <span class="segoe">о…Ќ</span> <span class="bold"> Купить </span> </div> </a>');
	}
}


Предполагается, что <div id='buy'></div> уже присутствует в разметке.

Последний раз редактировалось Gowa, 08.11.2016 в 06:13. Причина: очепятка
Ответить с цитированием
  #5 (permalink)  
Старый 09.11.2016, 03:54
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,662

Сообщение от Hinc Посмотреть сообщение
Пробую создать адаптивный сайт... со смартфона смотрится ужасно...
Таки верстать надо в стиле адаптивной сетки (responsive css grid) если хочешь сделать красиво...
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Последние книги по JavaScript! monolithed Учебные материалы 7 26.10.2010 19:40
Выдвет ошибку JavaScript Ромио Opera, Safari и др. 4 21.10.2010 20:34
Снятие затемнения с экрана при получении ответа от php срипта с помощью setInterval roma86 jQuery 0 16.08.2009 12:39
Меню выезжающее слева при подведении курсора к левой части экрана Артём Тарасов Общие вопросы Javascript 6 25.02.2009 14:18
Изменение размера блока реклама в зависимости от разрешения экрана. toxiz77 Общие вопросы Javascript 3 11.02.2009 14:12