-
blarney27
Hello. Is there a way I can create a typewritter effect using GB Pro?
-
Hi there,
No, you will need custom CSS.
1. Paste this block to your page:
<!-- wp:generateblocks/element {"uniqueId":"b3b0ee7c","tagName":"div","styles":{"width":"fit-content"},"css":".gb-element-b3b0ee7c{width:fit-content}"} --> <div class="gb-element-b3b0ee7c"><!-- wp:generateblocks/text {"uniqueId":"788128a3","tagName":"p","styles":{"display":"inline-block","overflowX":"hidden","overflowY":"hidden","whiteSpace":"normal","borderRightWidth":"2px","borderRightStyle":"solid"},"css":".gb-text-788128a3{border-right-style:solid;border-right-width:2px;display:inline-block;overflow-x:hidden;overflow-y:hidden;white-space:normal}","className":"typing"} --> <p class="gb-text gb-text-788128a3 typing">Typing Effect Typing Effect Typing Effect Typing Effect Typing Effect</p> <!-- /wp:generateblocks/text --></div> <!-- /wp:generateblocks/element -->
2. Add this CSS:
.typing { animation: typing 3s steps(20, end) infinite, blink 0.75s step-end infinite; } /* Typing animation */ @keyframes typing { from { width: 0; } to { width: 100%; } }
-
blarney27
I’ll give that a try, thanks!
-
You are welcome 🙂
Viewing 4 posts - 1 through 4 (of 4 total)
- You must be logged in to reply to this topic.