Test UI Features

Kursusindhold

Test UI Features

Test UI Features

1. Buttons

Hint/Solution Buttons Hint/Solution/Video Tutorial Buttons Hint and Solution Single Block Buttons Code Description Button Download File in the TXT format Download Course Summary

2. ContentDev Tools

Markdown Parsing Colors RegExp Creation Item Feedbacks

3. Image Tools

Image Image Swiper

4. Links

Link in a Text Link to Github and CodeSandbox

5. Other

Windows / Apple / Linux Instructions NN Cat/Dog CNN Hyperparameters Encryption Block Text with Color Legend Danyas playground Oleh S tests

6. Text Boxes

Deprecated - Note Deprecated - Study More Deprecated - Definition Text Block ChatGPT Prompt Input - Output Quote Text Box File name header Deprecated - Prerequisites Box With Links Superscript/Subscript Copyable Text Box Expandable List Task Heading Code Block - Highlighted & Copyable SQL Code Block - Highlighted & Copyable Python Code Block - Highlighted & Copyable JavaScript Code Block - Highlighted & Copyable Java Code Block - Highlighted & Copyable Dart Code Block - Highlighted & Copyable C++Code Block - Highlighted & Copyable C Code Block - Highlighted & Copyable C#

7. Tables

Scrollable Framed Table Table with the Tooltip Matrices

8. Developers

Buttons Code Description Button Download File Button Image Magnifier / Image Magnifier + Carousel Note / Study more / Definition Code Block - Highlighted & Copyable Prerequisites Box With Links Table Expandable List Link in Markdown

9. Deprecated

+ (deprecated) Hint and Solution Single Block + (deprecated) TypeScript Hint/Solution + (deprecated) C# Hint/Solution + (deprecated) JavaScript Hint/Solution + (deprecated) Java Hint/Solution + (deprecated) GO Lang Hint/Solution + (deprecated) Python Hint/Solution + (deprecated) Java Hint/Solution with Copyable & Highlighted Code + (deprecated) Scala Hint/Solution with Copyable & Highlighted Code + (deprecated) Hint/Video Tutorial + (deprecated) Hint/Solution/Video Tutorial (deprecated) Interactive Video + (deprecated) Images Slider + (deprecated) Images Carousel + (deprecated) Image Magnifier + (deprecated) Image Carousel & Magnifier +(deprecated) Image Magnifying Glass + (deprecated) Linked List + (deprecated) IDE Testing + (deprecated) CSS Example Practice Test + (deprecated) Spinning anim + (deprecated) Temporary Hint/Video Tutorial + (deprecated) Temporary Hint/Solution/Video Tutorial + (deprecated) Joke + (deprecated) Animated border + (deprecated) Default Custom Table + (deprecated) Table Action + (deprecated) Styled Table

+ (deprecated) Spinning anim

index.html

Вместо текста может быть видео или картинка.

Шаг 1:

Каждая картинка добавляется так:

Шаг 2:

Допустим у вас три картинки, нужно установить им задержку анимации чтобы они не стартовали с одной точки, если длительность анимации стоит на 30 секунд, то 30 / 3 (duration / n) получаем 10, выставляем с шагом в -10:

Шаг 3:

У каждой следующей картинки меняем id картинки, контейнера с текстом и контейнера в котором они оба. Плюс меняем начальный угол поворота для картинки и текста. Чтобы узнать какой ставить 360/кол-во картинок, в данном случае 120 градусов

Вторая картинка

Третья картинка Тут уже угол будет 240

Шаг: 4

Делаем так чтобы при наведении на контейнер с изображением оно становилось прозрачным

Выводим текст когда наводим мышкой на картинку

Кол-во этих блоков зависит от кол-ва картинок

Var alt klart?

Tak for dine kommentarer!

Sektion 9. Kapitel 21

Spørg AI

Spørg AI

Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat

Kursusindhold

Test UI Features

Test UI Features

1. Buttons

Hint/Solution Buttons Hint/Solution/Video Tutorial Buttons Hint and Solution Single Block Buttons Code Description Button Download File in the TXT format Download Course Summary

2. ContentDev Tools

Markdown Parsing Colors RegExp Creation Item Feedbacks

3. Image Tools

Image Image Swiper

4. Links

Link in a Text Link to Github and CodeSandbox

5. Other

Windows / Apple / Linux Instructions NN Cat/Dog CNN Hyperparameters Encryption Block Text with Color Legend Danyas playground Oleh S tests

6. Text Boxes

Deprecated - Note Deprecated - Study More Deprecated - Definition Text Block ChatGPT Prompt Input - Output Quote Text Box File name header Deprecated - Prerequisites Box With Links Superscript/Subscript Copyable Text Box Expandable List Task Heading Code Block - Highlighted & Copyable SQL Code Block - Highlighted & Copyable Python Code Block - Highlighted & Copyable JavaScript Code Block - Highlighted & Copyable Java Code Block - Highlighted & Copyable Dart Code Block - Highlighted & Copyable C++Code Block - Highlighted & Copyable C Code Block - Highlighted & Copyable C#

7. Tables

Scrollable Framed Table Table with the Tooltip Matrices

8. Developers

Buttons Code Description Button Download File Button Image Magnifier / Image Magnifier + Carousel Note / Study more / Definition Code Block - Highlighted & Copyable Prerequisites Box With Links Table Expandable List Link in Markdown

9. Deprecated

+ (deprecated) Hint and Solution Single Block + (deprecated) TypeScript Hint/Solution + (deprecated) C# Hint/Solution + (deprecated) JavaScript Hint/Solution + (deprecated) Java Hint/Solution + (deprecated) GO Lang Hint/Solution + (deprecated) Python Hint/Solution + (deprecated) Java Hint/Solution with Copyable & Highlighted Code + (deprecated) Scala Hint/Solution with Copyable & Highlighted Code + (deprecated) Hint/Video Tutorial + (deprecated) Hint/Solution/Video Tutorial (deprecated) Interactive Video + (deprecated) Images Slider + (deprecated) Images Carousel + (deprecated) Image Magnifier + (deprecated) Image Carousel & Magnifier +(deprecated) Image Magnifying Glass + (deprecated) Linked List + (deprecated) IDE Testing + (deprecated) CSS Example Practice Test + (deprecated) Spinning anim + (deprecated) Temporary Hint/Video Tutorial + (deprecated) Temporary Hint/Solution/Video Tutorial + (deprecated) Joke + (deprecated) Animated border + (deprecated) Default Custom Table + (deprecated) Table Action + (deprecated) Styled Table

+ (deprecated) Spinning anim

index.html

Вместо текста может быть видео или картинка.

Шаг 1:

Каждая картинка добавляется так:

Шаг 2:

Допустим у вас три картинки, нужно установить им задержку анимации чтобы они не стартовали с одной точки, если длительность анимации стоит на 30 секунд, то 30 / 3 (duration / n) получаем 10, выставляем с шагом в -10:

Шаг 3:

У каждой следующей картинки меняем id картинки, контейнера с текстом и контейнера в котором они оба. Плюс меняем начальный угол поворота для картинки и текста. Чтобы узнать какой ставить 360/кол-во картинок, в данном случае 120 градусов

Вторая картинка

Третья картинка Тут уже угол будет 240

Шаг: 4

Делаем так чтобы при наведении на контейнер с изображением оно становилось прозрачным

Выводим текст когда наводим мышкой на картинку

Кол-во этих блоков зависит от кол-ва картинок

Var alt klart?

Tak for dine kommentarer!

Sektion 9. Kapitel 21

some-alt