Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Помогите поправить код, определения высоты блоков и их сравнения (https://javascript.ru/forum/jquery/78783-pomogite-popravit-kod-opredeleniya-vysoty-blokov-i-ikh-sravneniya.html)

ozoro 05.11.2019 03:08
Помогите поправить код, определения высоты блоков и их сравнения
 
Задача сравнивать ВЫСОТУ блоков у которых 
display:inline-block; width:50%
ПРИ РАЗНОЙ ШИРИНЕ ОКНА БРАУЗЕРА, и если один блок становится больше на величину, например 100px, то делать display:block; width:100% добавляя класс. При этом списки ul li в первом блоке (верхнем) должны распределяться в 2-е колонки. Если блоки при определенной ширине окна браузера становяться высотой с допустимым значением, то удалять класс с правилами display:block; width:100% и в первом блоке списки делать в одну колонку, то есть возвращать блоки в display:inline-block; width:50%.
Использую такую библиотеку JS. Репозиторий github.

При определенных условиях все работает правильно. НО!!!

При некоторых размерах ширины окна классы начитают добавляться и удаляться до бесконечности. То есть блоки по очереди становятся то display:inline-block; width:50%, то display:block; width:100%.

Заметил, что когда блоки находятся с классом с правилами display:inline-block; width:50% и разница в высоте не превышает допустимое значение, то высота каждого блока определяется правильно один раз, как при ресайзе, так и при перезагрузке страницы, изменяется тоже один раз при изменении высоты блока.

НО когда блоки становятся display:block; width:100%, то высота блока определяется дважды.

То есть:
1. определяется высота которая была бы при данной ширине окна, если бы блоки ниходились display:inline-block; width:50%
2. определяется высота которая была бы при данной ширине окна, если бы блоки ниходились display:block; width:100%

В консоле, при выводе туда ширины ОДНОГО из блоков, это выглядит следующим образом:
Высота Первого блока: 2371
Высота Первого блока: 1216


Я так понимаю здесь и зарыта собака, поэтому думаю, надо определять при любых условиях ВЫСОТУ только блока, который был бы display:inline-block; width:50%, то есть значение которое выводится первым (в примере из консоли которое первое сверху).

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

Заранее, благодарю!

<!DOCTYPE html>
<html lang="ru">
<html>
    <head>
    <meta http-equiv="x-ua-compatible" content="IE=edge">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body{margin:0;padding:0}
#item-1 {
  background-color: yellow;
}
#item-2 {
  background-color: red;
}
.item{
display:inline-block;
width:49.5%;
vertical-align: top
}
.item h3 {   
    text-align: center;
}
.item.cs3{
display:block;
width:100%;
}
.cs1, .cs2 {
 padding: 20px;
text-align: left;
font-size: 30px;
}
.cs1 li, .cs2 li { margin-top: 25px }
.cs1 li:first-child{ margin-top: 0 }
.item h3{ margin: 0 }
.column-list {
	padding: 0 10px;
	/*outline: 1px solid #000;*/
	list-style-position: inside;
	   -moz-column-count: 1;
	-webkit-column-count: 1;
			column-count: 1;
			-webkit-column-gap: 20px; /* Chrome, Safari, Opera */
               -moz-column-gap: 20px; /* Firefox */
                    column-gap: 20px;
}
.column-list.cs4 {
	   -moz-column-count: 2;
	-webkit-column-count: 2;
			column-count: 2;
}
.column-list li ul, .column-list li {
	-webkit-column-break-inside: avoid;
			  page-break-inside: avoid;
				   break-inside: avoid;
}

</style>		
</head>
<body>

<div class="item">
<div class="cs1">
	<div id="item-1" class="item-for-resize-tracking">
		<h3>Заголовок первого блока</h3>		
        <ul class="column-list">		
            <li> Пункт #1 Пункт #1 Пункт #1 Пункт #1 Пункт #1 Пункт #1</li>
            <li>Пункт #2</li>
            <li>Пункт #3</li>
            <li>Пункт #4 Пункт #4 Пункт #4 Пункт #4 Пункт #4 Пункт #4 Пункт #4 Пункт #4 Пункт #4</li>
            <li>Пункт #5</li>
            <li>Пункт #6</li>
            <li>Пункт #7
            <ul>
                <li>Пункт #7.1</li>
                <li>Пункт #7.2</li>
                <li>Пункт #7.3 Пункт #7.3 Пункт #7.3 Пункт #7.3 Пункт #7.3 Пункт #7.3 Пункт #7.3 Пункт #7.3 Пункт #7.3</li>
                <li>Пункт #7.4</li>
                <li>Пункт #7.5</li>
            </ul>
            </li>
            <li>Пункт #8
            <ul>
                <li>Пункт #8.1  Пункт #8.1 Пункт #8.1 Пункт #8.1 Пункт #8.1</li>
                <li>Пункт #8.2</li>
                <li>Пункт #8.3</li>
            </ul>
            </li>
            <li>Пункт #9</li>
            <li>Пункт #10</li>
            <li>Пункт #11  Пункт #11 Пункт #11 Пункт #11 Пункт #11
            <ul>
                <li>Пункт #11.1</li>
                <li>Пункт #11.2</li>
                <li>Пункт #11.3</li>
                <li>Пункт #11.4</li>
                <li>Пункт #11.5</li>
                <li>Пункт #11.6</li>
            </ul>
            </li>
            <li>Пункт #12 Пункт #12 Пункт #12 Пункт #12 Пункт #12 Пункт #12 Пункт #12 Пункт #12 Пункт #12</li>
            <li>Пункт #13</li>
            <li>Пункт #14</li>
            <li>Пункт #15</li>
            <li>Пункт #16</li>
            <li>Пункт #14 Пункт #14 Пункт #14 Пункт #14 Пункт #14 Пункт #14 Пункт #14 Пункт #14 Пункт #14</li>
            <li>Пункт #15</li>
            <li>Пункт #16</li>			
        </ul>		
	</div>
</div>
</div>

<div class="item">
<div class="cs2">
	<div id="item-2" class="item-for-resize-tracking">
	<h3>Заголовок второго блока</h3>				
<p>Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст </p>
<p>Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст </p>
<p>Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст </p>
<p>Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст </p>
<p>Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст </p>
<p>Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст </p>
<p>Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст </p>
<p>Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст </p>
<p>Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст Текст  Текст  Текст  Текст  Текст </p>
	</div>
   </div>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://test8880.000webhostapp.com/src/js/ResizeSensor.js"></script>
<script>
const items = document.querySelectorAll('.item-for-resize-tracking');
const itemSizes = {};
const sizeChanges = {};

// Setup ResizeSensor on target item
items.forEach(item => {
  sizeChanges[item.id] = false;
  new ResizeSensor(item, function(e) {
    itemSizes[item.id] = e;
    sizeChanges[item.id] = true;
    if (!Object.values(sizeChanges).some(a => !a)) {
      compareSizes();
      Object.keys(sizeChanges).forEach(f => sizeChanges[f] = false);
    }
  });
});

function compareSizes() {
  const size1 = itemSizes['item-1'];
  const size2 = itemSizes['item-2'];
  if (size1 && size2) {
 
var 
	d = 200,
	dif = Math.abs(size1.height-size2.height),
	cz = 1;

		//console.log('Ширина окна: ' + window.innerWidth);
		//console.log(size1);
		//console.log('Разница высоты: ' + dif);
		console.log('Высота Первого блока: ' + size1.height);
		//console.log('Высота Второго блока: ' + size2.height);


	if (dif > d){	
		sz = 2;
		$(".item").addClass("cs3");
		$(".column-list").addClass("cs4");
		//console.log("Классы ДОБАВЛЕНЫ, sz = " + sz + " Разница: " + dif);
	} else {	
		sz = 1;
		$(".item").removeClass("cs3");
		$(".column-list").removeClass("cs4");	
		//console.log("Классы УДАЛЕНЫ, sz = " + sz + " Разница: " + dif);	
	}
  }
}
</script>	
</body>
</html>

ozoro 06.11.2019 16:20
Неужели проблема нерешаемая?

ksa 07.11.2019 11:34
Цитата:
Сообщение от ozoro (Сообщение 514987)
Неужели проблема нерешаемая?
У меня сегодня сантехник (!) поменял шланги на кухне к смесителю и поставил тройник на трубу... Прикрутил к тому тройнику шланг, а к шлангу кран...
Потратил на это не более часа, взял с меня 1200р. И отправился на следующий вызов. А ведь он не тратил время на получение высшего образования.
Смекаешь? ;)

laimas 07.11.2019 12:16
Цитата:
Сообщение от ksa
У меня сегодня сантехник (!) поменял шланги на кухне к смесителю ...
взял с меня 1200р
А самому?

ozoro 07.11.2019 18:10
Цитата:
У меня сегодня сантехник (!)...
Смекаешь? ;)
Это ты к чему?

рони 07.11.2019 18:55
ozoro,
ваше описание, несмотря на подробности, слабо помогает понять проблему, а значит мало кто будет расходовать время на решение. думаю что и раздел работа вам ничем не поможет.

ozoro 08.11.2019 01:56
рони,
Вот записал видео с экрана на яндекс диске, в котором объяснил что мне нужно и в чем проблема.

Думаю, теперь будет понятно. Не ругайте, немного путаюсь в терминах, я далеко не программист, делаю потихоньку сайт для себя и узнаю что-то новое.

Прошу помочь!

Заранее, благодарю!

ksa 08.11.2019 07:17
Цитата:
Сообщение от laimas
А самому?
В следующий раз позову тебя... :D
Машины ты тоже ремонтируешь? Авторемонтеры так же по 1000-1500р за раз берут, не меньше...

Ты и в магазин наверное за харчами не ходишь? Все сам растишь и производишь?

ksa 08.11.2019 07:18
Цитата:
Сообщение от ozoro
Это ты к чему?
Значит не смекнул... :(

Платить нужно людям за решение твоих проблем. Разве это так сложно понять?

laimas 08.11.2019 07:35
Цитата:
Сообщение от ksa
Ты и в магазин наверное за харчами не ходишь? Все сам растишь и производишь?
Ну само собой, под каждой кроватью грядка. Другой контекст у темы, а то бы ответил по теме. :)

Malleys 08.11.2019 09:52
Здравствуйте, ozoro!

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

Вот ваш основной алгоритм. Вы измеряете высоты 1-ого и 2-ого блоков, вычисляете разницу, и если она оказывается больше, чем 200 пикселей, то элементы выстраиваются стопкой, а иначе столбиками.

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

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

Код, я привожу ниже.

«Текст Текст Текст» можно генерировать при помощи скрипта.

При каждом изменении размеров окна, в консоль выводятся высоты блоков и разница их высот, это можно удалить.

Можно сразу посмотреть результат в отдельной вкладке... https://charm-launch.glitch.me/columns.html
<!DOCTYPE html>
<html lang="ru">
<html>

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style>
		body {
			margin: 0;
			padding: 0;
		}

		#item-1 { background-color: gold; }
		#item-2 { background-color: crimson; }

		.item {
			display: inline-block;
			width: 49.5%;
			vertical-align: top;
		}

		.item h3 { text-align: center; }

		.item.cs3 {
			display: block;
			width: 100%;
		}

		.cs1, .cs2 {
			padding: 20px;
			text-align: left;
			font-size: 30px;
		}

		.cs1 li, .cs2 li { margin-top: 25px; }
		.cs1 li:first-child { margin-top: 0; }
		.item h3 { margin: 0; }

		.column-list {
			padding: 0 10px;
			list-style-position: inside;
			   -moz-column-count: 1;
			-webkit-column-count: 1;
			        column-count: 1;
			-webkit-column-gap: 20px;
			   -moz-column-gap: 20px;
			        column-gap: 20px;
		}

		.column-list.cs4 {
			   -moz-column-count: 2;
			-webkit-column-count: 2;
			        column-count: 2;
		}

		.column-list li ul,
		.column-list li {
			-webkit-column-break-inside: avoid;
			          page-break-inside: avoid;
			               break-inside: avoid;
		}
	</style>
</head>
<body>
	<div class="item">
		<div class="cs1">
			<div id="item-1">
				<h3>Заголовок первого блока</h3>
				<ul class="column-list">
					<li>Пункт #1 Пункт #1 Пункт #1 Пункт #1 Пункт #1 Пункт #1</li>
					<li>Пункт #2</li>
					<li>Пункт #3</li>
					<li>Пункт #4 Пункт #4 Пункт #4 Пункт #4 Пункт #4 Пункт #4 Пункт #4 Пункт #4 Пункт #4</li>
					<li>Пункт #5</li>
					<li>Пункт #6</li>
					<li>Пункт #7
						<ul>
							<li>Пункт #7.1</li>
							<li>Пункт #7.2</li>
							<li>Пункт #7.3 Пункт #7.3 Пункт #7.3 Пункт #7.3 Пункт #7.3 Пункт #7.3 Пункт #7.3 Пункт #7.3 Пункт #7.3</li>
							<li>Пункт #7.4</li>
							<li>Пункт #7.5</li>
						</ul>
					</li>
					<li>Пункт #8
						<ul>
							<li>Пункт #8.1 Пункт #8.1 Пункт #8.1 Пункт #8.1 Пункт #8.1</li>
							<li>Пункт #8.2</li>
							<li>Пункт #8.3</li>
						</ul>
					</li>
					<li>Пункт #9</li>
					<li>Пункт #10</li>
					<li>Пункт #11 Пункт #11 Пункт #11 Пункт #11 Пункт #11
						<ul>
							<li>Пункт #11.1</li>
							<li>Пункт #11.2</li>
							<li>Пункт #11.3</li>
							<li>Пункт #11.4</li>
							<li>Пункт #11.5</li>
							<li>Пункт #11.6</li>
						</ul>
					</li>
					<li>Пункт #12 Пункт #12 Пункт #12 Пункт #12 Пункт #12 Пункт #12 Пункт #12 Пункт #12 Пункт #12</li>
					<li>Пункт #13</li>
					<li>Пункт #14</li>
					<li>Пункт #15</li>
					<li>Пункт #16</li>
					<li>Пункт #14 Пункт #14 Пункт #14 Пункт #14 Пункт #14 Пункт #14 Пункт #14 Пункт #14 Пункт #14</li>
					<li>Пункт #15</li>
					<li>Пункт #16</li>
				</ul>
			</div>
		</div>
	</div>

	<div class="item">
		<div class="cs2">
			<div id="item-2">
				<h3>Заголовок второго блока</h3>
				<script>
					document.write(new Array(10).join("<p>" + new Array(41).join("Текст ") + "</p>"))
				</script>
			</div>
		</div>
	</div>

	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
	<script>

		const item1 = document.getElementById("item-1");
		const item2 = document.getElementById("item-2");
		const MAX_HEIGHT_DIFF = 200;

		function resizeHandler() {
			$(".item").removeClass("cs3");
			$(".column-list").removeClass("cs4");

			const Δh = Math.abs(item1.offsetHeight - item2.offsetHeight);
			console.log(`
				h₁ = %s
				h₂ = %s
				Δh = %s
			`, item1.offsetHeight, item2.offsetHeight, Δh);

			if (Δh > MAX_HEIGHT_DIFF) {
				$(".item").addClass("cs3");
				$(".column-list").addClass("cs4");
			}
		}

		resizeHandler();
		addEventListener("resize", resizeHandler);

	</script>
</body>

</html>


ksa, рони, laimas, какая речь может идти о трубах в кроватях и сантехниках, когда это тема про вычисление разности высот? Просто вы, должно быть Δh не осилили, бывает! laimas, лучше расскажите (или снимите жаркое кино) про идентификаторы?
Цитата:
Сообщение от ozoro
Неужели проблема нерешаемая?
Решаемая, смотри выше!

laimas 08.11.2019 10:28
Цитата:
Сообщение от Malleys
лучше расскажите (или снимите жаркое кино) про идентификаторы
Какая может быть речь о кино, когда тема о разности высот?
Я вообще и не собирался чего-то здесь осиливать, но коли вы киноман, хорошо, как только Брюс Уиллис даст согласие сниматься у меня, так сразу и начну. ;)

Примечание: Мужик в доме должен быть мужиком, а не оленем, а не отличать трубы от гибкой подводки, ну это позор для него.

ozoro 08.11.2019 19:07
Malleys,
Благодарю, то что мне было нужно!

Часть кода не понял, так как нигде не видел таких записей или не обращал внимания, но работает так как мне надо.

Malleys, можешь пояснить вот это:
const Δh = Math.abs(item1.offsetHeight - item2.offsetHeight); // что означает треугольник перед h и как такой треугольник набрать на клавиатуре?

	console.log(`
	     h₁ = %s // что это означает? и как h или другую букву с такой маленькой цыфрой набрать на клавиатуре?
	     h₂ = %s
	     Δh = %s
	`, item1.offsetHeight, item2.offsetHeight, Δh); // это, я понимаю, выводятся по порядку заначения переменных указанных в апострофах?



Копирую и вставляю в notepad++ и у меня вместо маленьких цифр получаются квадратики, а вернее квадратная рамка.



Копирую этот код с квадратиками и всавляю сюда (код выше в настоящем сообщении, который прошу разъяснить) эти кадратики опять становяться маленькими цифрами? Магия какая-то:blink: :)

Почему так получается?

laimas 09.11.2019 07:49
Цитата:
Сообщение от ozoro
Копирую и вставляю в notepad++
Вставьте в Word, будет нормально. Не партесь, замените на простое, ведь разницы нет как вы переменные назовете.

Malleys 09.11.2019 15:30
Цитата:
Сообщение от ozoro
это, я понимаю, выводятся по порядку значения переменных указанных в апострофах?
Да, для форматирования вы можете использовать подстановочные символы с дополнительными параметрами, подробнее смотрите на developer.mozilla.org!

Цитата:
Сообщение от ozoro
Копирую и вставляю в notepad++ и у меня вместо маленьких цифр получаются квадратики, а вернее квадратная рамка.
Вы можете сохранить, оно будет работать, просто у вас в редакторе используется шрифт, в котором нет таких символов. Поэтому вы не видите начертание символа, но компьютер знает, какой там символ. Используйте качественный шрифт, в котором прорисованы эти символы, например, Fira Code, Menlo, Pragmata Pro, Ubuntu Mono или DejaVu Sans Mono. Я использую шрифт Fira Code в редакторе кода Visual Studio Code.

Вот так этот фрагмент кода выглядит в редакторе кода Visual Studio Code с поддержкой тысяч расширении для удобной разработки (шрифт Fira Code)



Также вы можете установить себе Sublime Text, есть встроенный пакетный менеджер с расширениями для множества языков программирования (шрифт Menlo, но это всё настраиваемое, включая цветовые темы)



Также вас может заинтересовать редактор Brackets со встроенным сервером и редактированием вживую HTML и CSS. (шрифт Operator Mono, но в нём не все символы есть, на рисунке видно, что ∆ взято из другого шрифта, в настройках можно указать множественные шрифты)



Автодополнение, подсказки, проверка типов, синтаксиса, автоматизация сборки, встроенная консоль, упрощённая работа с git, автоформатирование кода (от тех кто мучался в notepad++), подсветка синтаксиса и многое другое доступно в современных редакторах на всех платформах.

Ссылки на упомянутые программы для тех, кто программирует...
Цитата:
Сообщение от ozoro
Копирую этот код с квадратиками и вставляю сюда (код выше в настоящем сообщении, который прошу разъяснить) эти квадратики опять становятся маленькими цифрами?
Это не магия, это значит, что в том редакторе используется шрифт, в котором не прорисован нужный символ, поэтому он отображается как квадратик (missing glyph). Когда вы копируете текст, то в буфер обмена помещается не картинка с экрана, а данные, представляющие этот текст.

Цитата:
Сообщение от ozoro
что означает треугольник перед h
Это греческая буква дельта, которая является общепринятым математическим обозначением изменения или различия между значениями переменных. Вы можете ещё больше узнать о применении этого символа на wikipedia.org!

Цитата:
Сообщение от ozoro
треугольник перед h… как такой треугольник набрать на клавиатуре?
Если вы используете английскую раскладку, то вы можете нажать ⌥J (т. е. Option+J), получается символ «∆»! Также этот и другие символы можно выбрать из палитры символов Shift+Cmd+Пробел
Возможно вам будет интересно посмотреть видео на эту тему...
https://youtu.be/xGS6b7uPEcg?t=31
https://youtu.be/boZA85IcDZQ?t=20

Цитата:
Сообщение от laimas
Вставьте в Word, будет нормально.
Ужас!

laimas 09.11.2019 15:32
Цитата:
Сообщение от Malleys
Ужас!
Куда ужаснее выпендриваться, предлагая всякую хрень в качестве имен, потом предлагая к ним обширные инструкции. Кроме вас на форуме этой хренью никто не страдает.

Malleys 09.11.2019 15:48
Т. е. печатать код в Word это для вас нормально? Установил я Brackets, значит страдаю! С вами всё понятно!

laimas 09.11.2019 15:53
Цитата:
Сообщение от Malleys
Т. е. печатать код в Word это для вас нормально?
Не нормально не в Word, который, к сожалению, пришлось упоминать, а маяться дурью. Ведь даже ежик понимает, что код предлагаемый будет копироваться и вставляться во что угодно, которое вместо вашей красоты будет отображать шлак. Так что ваши "изыски" в этом плане чистый выпендрежь.

Malleys 09.11.2019 17:43
Цитата:
Сообщение от laimas
Ведь даже ежик понимает, что код предлагаемый будет копироваться и вставляться во что угодно, которое вместо вашей красоты будет отображать шлак.
Очевидно нужно использовать обновлённую ОС с нормальной поддержкой Unicode. В windows 10 есть такие проблемы? Почему такие проблемы?

Помню у mp3-файлов в проигрывателе на mac и на телефоне всё нормально отображались названия русских песен, а на windows 7 что-то «крякозябры»! Так что это не моя проблема! А ещё там было windows-949 и windows-1251, которые нужно разгадывать на windows 10 (имена файлов стали «крякозябрами»). Красота!

laimas 09.11.2019 17:50
Цитата:
Сообщение от Malleys
Так что это не моя проблема!
И не моя, а ваша, вам же приходится к своему коду прилагать инструкции. А думать, что все используют ту же платформу и инструменты, что и вы, это самонадеянность, а заставлять это делать, это уже хамство. ;)

Malleys 09.11.2019 17:55
Какие инструкции, вы что?

Я показал, какие есть редакторы кода. Эти редакторы работают и в Windows и в MacOS и в Linux. Я показал возможности!

Unicode – это стандарт, который не зависит ни от какой платформы, какое может быть хамство?


Часовой пояс GMT +3, время: 11:29.