Zero BlockXX
Click "Block Editor" to enter the edit mode. Use layers, shapes and customize adaptability. Everything is in your hands.
Tilda Publishing
create your own block from scratch
Text line #1
Text line #2
Text line #3
Curiosity about life in all its aspects, I think, is still the secret of great creative people.
The work you do while you procrastinate is probably the work you should be doing for the rest of your life.
Design creates culture. Culture shapes values. Values determine the future.
<script>
$(document).ready(function(){
//Размечаем подсказки
$('div[class*="ndt-texts_"]').each(function(){
let elem = $(this);
elem.addClass('hint-marker');
let classList = elem.attr('class');
classList = classList.split(' ');
for (let key in classList) {
if (classList[key].indexOf("ndt-texts_") >= 0){
let nClass = classList[key].split('_')[1];
elem.attr('data-hint-num', nClass);
};
};
});
let hoverElem;
let index;
$('div[class*="ndt-texts_"]').hover(
function() {
$('.active-hover').removeClass('active-hover');
$('.show-elem').removeClass('show-elem');
hoverElem = $(this);
hoverElem.addClass('active-hover');
index = hoverElem.attr('data-hint-num');
$('.ndt_elem_'+index).addClass('show-elem');
}, function() {
}
);
$('.ndt-texts_1').addClass('active-hover');
$('.ndt_elem_1').addClass('show-elem');
});
</script>
<style>
div[class*="ndt_elem_"] {
opacity: 0;
pointer-events: none;
transition: all 0.2s ease-in-out;
}
div[class*="ndt_elem_"].show-elem {
opacity: 1;
pointer-events: auto;
}
div[class*="ndt-texts_"]{
cursor: pointer;
}
div[class*="ndt-texts_"].active-hover .tn-atom{
font-weight: 600 !important;
}
</style>