Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Lernen Hint and Solution Single Block Buttons | Buttons
Test UI Features

book
Hint and Solution Single Block Buttons

Readme

  1. Goal of the Hint Button: is designed to hide the next block that follows it. The block that gets hidden can be of any type;
  2. How to Implement:
    • First, copy the necessary source code;
    • Paste the code into the designated HTML block;
    • After the HTML block, use any block to serve as the hidden content that will be revealed when the hint is clicked.

Element - Hint Button

  • fvs
  • fed
  • feadfe qfecew

Source code for Hint Element

html

index.html

copy
<link
rel="stylesheet"
href="https://codefinity-content-media-v2.s3.eu-west-1.amazonaws.com/courses/c1087363-9025-4c37-8d5e-983a32a007e9/buttons-section/hint-block-separately/hint.css"
/>

<button
class="button"
type="button"
onclick="handleTempHint('hint-temp')"
id="hint-temp"
style="margin-right: 10px"
>
Hint
</button>

<script src="https://codefinity-content-media-v2.s3.eu-west-1.amazonaws.com/courses/c1087363-9025-4c37-8d5e-983a32a007e9/buttons-section/hint-block-separately/hint.js"></script>

Readme

  1. Goal of the Solution Button: redirects the user to another resource or page;
  2. How to Implement:
    • Copy the necessary source code for the solution button;
    • Replace the value of the href attribute with the URL of the resource you want the user to be redirected to.

Spanish

  • ítem 1;
  • ítem 2;
  • ítem código 3.

Portuguese

  • item 1;
  • item 2;
  • item código 3.

French

  • Indice un;
  • Indice deux;
  • Indice trois.

German

  • Hinweis eins;
  • Hinweis zwei;
  • Hinweis drei.

Ukrainian

  • Підказка один;
  • Підказка два;
  • Підказка три.

Element - Solution Button

Source code for Solution Element

html

index.html

copy
<link
rel="stylesheet"
href="https://codefinity-content-media.s3.eu-west-1.amazonaws.com/css_custom_styles/solution.css"
/>

<!-- Change value for the href attribute -->
<a
href="https://codesandbox.io/p/sandbox/react-styling-example-3-u05q6s?from-embed"
target="_blank"
class="solution"
>
Solution
</a>

Spanish

Portuguese

French

German

Ukrainian

Abschnitt 1. Kapitel 3
some-alt