Бегущая строка js: javascript — как создать непрерывную бегущую строку?

<marquee>
	<div></div>
	<div></div>
	<div></div>
	<div></div>
</marquee>

<style type="text/css">
	marquee div {
		width:20px;
		height:20px;
		display:inline-block;
		border:1px solid red;
	}
</style>

<section>
    <div>
        <div>
            <span>
                <img src="asserts/image-1.
  jpg" alt="" border="0">
                <img src="asserts/image-2.jpg" alt="" border="0">
                <img src="asserts/image-3.jpg" alt="" border="0">
                <img src="asserts/image-4.jpg" alt="" border="0">
            </span>
            <span>
                <img src="asserts/image-1.jpg" alt="" border="0">
                <img src="asserts/image-2.jpg" alt="" border="0">
                <img src="asserts/image-3.jpg" alt="" border="0">
                <img src="asserts/image-4.jpg" alt="" border="0">
            </span>
        </div>
    </div>
</section>

$blockHeight: 420px;

@-webkit-keyframes marquee {
    0% {
		left: 0;
	}
	100% {
		left: -100%;
	}
}

@keyframes marquee {
	0% {
		left: 0;
	}
	100% {
		left: -100%;
	}
}

.b-marquee-line {
	&__flow {
		background: #f0f0f0;
		font-size: 0;
		line-height: 0;
		height: $blockHeight;
		overflow: hidden;
		position: relative;
		width: 100%;
		&-in {
			display: block;
			height: $blockHeight;
			.cssanimations & {
				width: 200%;
				position: absolute;
				overflow: hidden;
				-webkit-animation: marquee 40s linear infinite;
						animation: marquee 40s linear infinite;
			}
		}
		&-block {
			white-space: nowrap;
			.no-cssanimations &:last-child {
				display: none;
			}
			.
  cssanimations & {
				white-space: nowrap;
				float: left;
				width: 50%;
			}
		}
		&-item {
			height: $blockHeight;
		}
	}
}

с использованием сокращенного свойства:

div {
  анимация: mymove 5s бесконечно;
}

Попробуйте сами »

---

Определение и использование

Свойство animation является сокращенным свойством для:

• имя-анимации
• продолжительность анимации
• функция синхронизации анимации
• анимация-задержка
• число итераций анимации
• направление анимации
• режим анимации-заполнения
• состояние воспроизведения анимации

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

Показать демо ❯

Значение по умолчанию:	нет 0 легкий 0 1 обычный нет работает
Унаследовано:	нет
Анимация:	№. Читать про анимированный
Версия:	CSS3
Синтаксис JavaScript:	объект .style.animation=»mymove 5s бесконечно» Попробуй

---

Поддержка браузера

Числа в таблице указывают первую версию браузера, которая полностью поддерживает это свойство.

Числа, за которыми следует -webkit-, -moz- или -o-, указывают на первую версию, которая работала с префиксом.

Собственность
анимация	43.0 4. 0 -вебкит-	10,0	16,0 5,0 -мунц-	9.0 4.0 -вебкит-	30,0 15,0 -webkit- 12,0 -o-

---

---

Синтаксис CSS

анимация: имя продолжительность функция времени задержка количество итераций направление воспроизведения в режиме заполнения ;

Значения свойств

Значение	Описание
имя-анимации	Указывает имя ключевого кадра, который вы хотите привязать к селектору
продолжительность анимации	Указывает, сколько секунд или миллисекунд требуется для завершения анимации
функция синхронизации анимации	Задает кривую скорости анимации
задержка анимации	Указывает задержку перед запуском анимации
число итераций анимации	Указывает, сколько раз должна воспроизводиться анимация
анимация-направление	Указывает, должна ли анимация воспроизводиться в обратном порядке в чередующихся циклах
режим анимации-заполнения	Указывает, какие значения применяются анимацией вне времени ее выполнения
состояние воспроизведения анимации	Указывает, запущена анимация или приостановлена ​​
начальный	Устанавливает для этого свойства значение по умолчанию. Читать про начальный
унаследовать	Наследует это свойство от родительского элемента. Читать о наследовать

---

Связанные страницы

Учебник по CSS: CSS-анимация

Ссылка на HTML DOM: свойство анимации

❮ Предыдущая Полное руководство по CSS Следующий ❯

ВЫБОР ЦВЕТА

---

---

---

Лучшие учебники

Учебное пособие по HTML
Учебное пособие по CSS
Учебное пособие по JavaScript
Учебное пособие
Учебное пособие по SQL
Учебное пособие по Python
Учебное пособие по W3.CSS
Учебное пособие по Bootstrap
Учебное пособие по PHP
Учебник по Java
Учебник по C++
Учебник по jQuery

Основные ссылки

HTML Reference
CSS Reference
JavaScript Reference
SQL Reference
Python Reference
W3.CSS Reference
Bootstrap Reference
PHP Reference
HTML Colors
Java Reference
Angular Reference
jQuery Reference

3 Top4 Examples Примеры HTML
Примеры CSS
Примеры JavaScript
Примеры инструкций
Примеры SQL
Примеры Python
Примеры W3. CSS
Примеры Bootstrap
Примеры PHP
Примеры Java
Примеры XML
Примеры jQuery

---

FORUM | О

W3Schools оптимизирован для обучения и обучения. Примеры могут быть упрощены для улучшения чтения и обучения. Учебники, ссылки и примеры постоянно пересматриваются, чтобы избежать ошибок, но мы не можем гарантировать полную правильность всего содержания. Используя W3Schools, вы соглашаетесь прочитать и принять наши условия использования, куки-файлы и политика конфиденциальности.

Copyright 1999-2022 Refsnes Data. Все права защищены.
W3Schools работает на основе W3.CSS.

Навигация по коду с помощью отладчика — Visual Studio (Windows)

• Статья
• 22.09.2022
• 9 минут на чтение

Применяется к: Visual Studio Visual Studio для Mac Visual Studio Code

Отладчик Visual Studio может помочь вам перемещаться по коду, чтобы проверить состояние приложения и показать поток его выполнения, который также известен как шаг кода . Вы можете использовать сочетания клавиш, команды отладки, точки останова и другие функции, чтобы быстро перейти к коду, который хотите изучить. Если вы знакомы с командами навигации и ярлыками отладчика, вы сможете быстрее и проще находить и устранять проблемы с приложениями.

Примечание

Если вы новичок в отладке кода, возможно, вы захотите прочитать Отладка для абсолютных новичков и Методы и инструменты отладки, прежде чем читать эту статью.

Вход в режим приостановки

В режиме приостановки выполнение приложения приостанавливается, пока функции, переменные и объекты остаются в памяти. Когда отладчик находится в режиме приостановки, вы можете перемещаться по коду. Существует два распространенных способа быстрого входа в режим приостановки:

• Начните пошаговое выполнение кода, выбрав F10 или F11 . Это позволит вам быстро найти точку входа вашего приложения. Затем вы можете продолжать нажимать пошаговые команды для навигации по коду.

• Запустить в определенное место или функцию, например, установив точку останова и запустив приложение.

  Например, в редакторе кода в Visual Studio можно использовать команду Run To Cursor , чтобы запустить приложение с подключенным отладчиком и войти в режим приостановки, а затем выбрать F11 для навигации по коду:

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

Большинство окон отладчика, например окна Modules и Watch , доступны, только если отладчик подключен к вашему приложению. Некоторые функции отладчика, такие как просмотр значений переменных в окне Locals или оценка выражений в окне Watch , доступны только тогда, когда отладчик приостановлен (то есть в режиме приостановки).

Примечание

Если вы взломаете код, в котором не загружены исходные файлы или файлы символов (.pdb), отладчик отображает Исходные файлы не найдены или Символы не найдены Страница, которая может помочь вам найти и загрузить файлы. См. Указание символа (.pdb) и исходных файлов. Если вы не можете загрузить символы или исходные файлы, вы можете выполнить отладку инструкций по сборке в окне Disassembly .

Пошаговое выполнение кода

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

Шаг в код

Чтобы остановиться на каждом операторе при отладке, используйте Отладка > Шаг в или выберите F11 .

Отладчик проходит через операторы кода, а не через физические строки. Например, предложение if можно записать в одну строку:

• . С#
• ВБ

 инт х = 42;
строка s = "Не ответил";
if( int x == 42) s = "Отвечено!";
 

Но когда вы вступаете в эту строку, отладчик рассматривает условие как один шаг, а последствие — как другой. В предыдущем примере условие истинно.

При вызове вложенной функции Step Into выполняет переход к самой глубоко вложенной функции. Например, если вы используете Step Into в таком вызове, как Func1(Func2()) , отладчик переходит к функции Func2 .

Совет

При выполнении каждой строки кода вы можете наводить указатель мыши на переменные, чтобы увидеть их значения, или использовать окна Локальные и Контрольные значения, чтобы наблюдать за изменением значений. Вы также можете визуально отслеживать стек вызовов, когда переходите к функциям. (Только для Visual Studio Enterprise: см. раздел Сопоставление методов в стеке вызовов во время отладки.)

Пошагово пройтись по коду и пропустить некоторые функции

При отладке вы можете не обращать внимания на функцию. Или, возможно, вы знаете, что какой-то код работает, например хорошо протестированный библиотечный код. Вы можете использовать следующие команды, чтобы пропустить код при пошаговом выполнении кода. Функции по-прежнему выполняются, но отладчик пропускает их.

Клавиатурная команда	Команда меню отладки	Описание
F10	Перешагнуть	Если текущая строка содержит вызов функции, Step Over запускает код, а затем приостанавливает выполнение на первой строке кода после возврата из вызванной функции.
Смена + F11	Выход	Step Out продолжает выполнение кода и приостанавливает выполнение, когда текущая функция возвращается. Отладчик пропускает текущую функцию.

Запустить в определенное место или функцию

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

Выполнение до точки останова в коде

Чтобы установить простую точку останова в коде, выберите крайнее левое поле рядом со строкой кода, выполнение которой вы хотите приостановить. Вы также можете выбрать строку, а затем выбрать F9 , выбрать Отладка > Переключить точку останова или щелкните правой кнопкой мыши и выберите Точка останова > Вставить точку останова . Точка останова отображается в виде красной точки на левом поле рядом со строкой кода. Отладчик приостанавливает выполнение непосредственно перед выполнением строки.

Точки останова в Visual Studio предоставляют широкий набор функций, таких как условные точки останова и точки трассировки. Дополнительные сведения см. в разделе Использование точек останова.

Выполнить до точки останова функции

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

Чтобы указать точку останова функции по имени

1. Выберите Отладка > Новая точка останова > Точка останова функции .

2. В диалоговом окне New Function Breakpoint введите имя функции и выберите ее язык:

3. Выберите OK .

Если функция перегружена или находится в нескольких пространствах имен, вы можете выбрать нужную в окне Точки останова : отладки, откройте окно Call Stack , выбрав Debug > Windows > Стек вызовов .

В окне Call Stack щелкните правой кнопкой мыши функцию и выберите Run To Cursor или выберите Ctrl + F10 .

Сведения о визуальном отслеживании стека вызовов см. в разделе Сопоставление методов в стеке вызовов во время отладки.

Запуск к местоположению курсора

Чтобы перейти к местоположению курсора, в исходном коде или окне Call Stack выберите строку, на которой вы хотите разорвать, затем щелкните правой кнопкой мыши и выберите Выполнить до курсора или выберите Ctrl + F10 . Выбор Run To Cursor подобен установке временной точки останова.

Принудительный запуск к местоположению курсора

Чтобы перейти к местоположению курсора, в исходном коде или окне стека вызовов выберите строку, на которой вы хотите прерваться, затем щелкните правой кнопкой мыши и выберите Принудительный запуск к курсору . При выборе Force Run To Cursor все точки останова и исключения первого шанса будут пропущены до тех пор, пока отладчик не достигнет строки кода, в которой находится курсор.

Выполнить до щелчка

Пока отладчик приостановлен, вы можете навести указатель мыши на оператор в исходном коде или в окне Дизассемблирование и выбрать зеленую стрелку Выполнить выполнение здесь . Если вы используете Run to Click , вам не нужно устанавливать временную точку останова.

Примечание

Выполнить до щелчка Функция доступна начиная с Visual Studio 2017.0309 Нажмите клавишу Shift , а затем выберите Принудительное выполнение запуска здесь (двойная зеленая стрелка). При выборе этого параметра приложение подключает отладчик Visual Studio и останавливается в месте расположения курсора. Любые точки останова и исключения первого шанса, обнаруженные во время выполнения, временно отключены.

Примечание

Force Run to Click доступно начиная с Visual Studio 2022.0309 Отладка > Прервать все или выбрать Ctrl + Alt + Прервать .

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

Если вы хотите изменить следующую инструкцию, которая будет выполняться, отладчик должен находиться в режиме приостановки. В исходном коде или в окне Дизассемблирование перетащите желтую стрелку на другую строку или щелкните правой кнопкой мыши строку, которую вы хотите запустить следующей, и выберите Задать следующую инструкцию .

Счетчик программ сразу переходит на новое место. Инструкции между старой и новой точками выполнения не выполняются. Но если вы переместите точку выполнения назад, промежуточные инструкции не будут отменены.

Предупреждение

• Перемещение следующего оператора в другую функцию или область обычно вызывает повреждение стека вызовов, что вызывает ошибку или исключение во время выполнения. Если вы попытаетесь переместить следующий оператор в другую область, отладчик выдаст вам предупреждение и возможность отменить операцию.
• В Visual Basic вы не можете переместить следующий оператор в другую область или функцию.
• В родном C++, если у вас включены проверки во время выполнения, установка следующего оператора может вызвать исключение, когда выполнение достигает конца метода.
• Когда Изменить и продолжить включено, Установить следующий оператор не удастся, если вы внесли изменения, которые Изменить и продолжить не могут переназначить немедленно. Такая ситуация может возникнуть, например, если вы редактировали код в блоке catch. Когда это происходит, появляется сообщение об ошибке, уведомляющее о том, что операция не поддерживается.
• В управляемом коде вы не можете переместить следующую инструкцию, если:
  • Следующий оператор находится в методе, отличном от текущего оператора.
  • Отладка была запущена в режиме оперативной отладки.
  • Выполняется раскрутка стека вызовов.
  • Возникло исключение System.StackOverflowException или System.Threading.ThreadAbortException.

Отладка непользовательского кода

По умолчанию отладчик пытается отладить только код вашего приложения, включив параметр Just My Code . Дополнительные сведения о том, как эта функция работает для различных типов проектов и языков, а также о том, как ее можно настроить, см. в разделе Just My Code.

Чтобы просматривать код фреймворка, код сторонних библиотек или системные вызовы во время отладки, вы можете отключить «Только мой код». В Tools (или Debug ) > Options > Debugging снимите флажок Enable Just My Code . Когда параметр «Только мой код» отключен, непользовательский код отображается в окнах отладчика, и отладчик может перейти к непользовательскому коду.

Примечание

Just My Code не поддерживается для проектов устройств.

Отладка системного кода

Если вы загрузили символы отладки для системного кода Microsoft и отключили функцию «Только мой код», вы можете войти в системный вызов так же, как и в любой другой вызов.

Дополнительные сведения о загрузке символов Microsoft см. в разделе Настройка расположения файлов символов и параметров загрузки.

Чтобы загрузить символы для определенного системного компонента

1. Во время отладки откройте окно Модули , выбрав Отладка > Windows > Модули или нажав Ctrl + Alt + U .

2. В окне Модули можно указать, какие модули имеют загруженные символы в столбце Состояние символа .