//Is there a way to make the cursor blink using a timer in this scenario? I've noticed that the CursorCssClass is changing in debug mode, but the cursor itself doesn't blink in the browser.
<section id="hero" class="d-flex flex-column justify-content-center align-items-center">
<div class="hero-container">
<h1>test test</h1>
<p>I'm tester <span style="@CursorCssClass">|</span></p>
</div>
</section>
@code {
private bool hideCursor = true;
private System.Timers.Timer aTimer;
private string CursorCssClass => hideCursor ? "opacity: 0" : "opacity: 1";
private void ToggleCursor()
{
aTimer = new System.Timers.Timer();
aTimer.Interval = 1000;
aTimer.Elapsed += OnTimedEvent;
aTimer.AutoReset = true;
aTimer.Enabled = true;
}
private void OnTimedEvent(Object source, System.Timers.ElapsedEventArgs e)
{
hideCursor = !hideCursor;
}
protected override Task OnInitializedAsync()
{
ToggleCursor();
return base.OnInitializedAsync();
}
}