Javascript Typed.js动画闪烁光标不工作

所以我尝试在typed.js上使用闪烁光标，这是一个很棒的js.plugin，可以在这里找到：

我试图让闪烁光标在键入文本时与文本内联，但正如您在JSFIDLE中看到的： 它只是在侧面闪烁

这样做的原因是我对键入的文本应用了一些id，以便文本居中，字体更改等

不幸的是，这似乎破坏了眨眼效果

是否有人知道如何使闪烁与CSS样式的工作，如js小提琴所示应用

    .typed-cursor{
    opacity: 1;
    -webkit-animation: blink 0.7s infinite;
    -moz-animation: blink 0.7s infinite;
    animation: blink 0.7s infinite;
    }
    @keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
    }
    @-webkit-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
    }
    @-moz-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
    }

这是typed.js页面上的代码，用于使键入的光标正确闪烁

非常感谢你的帮助。当然，我会投票给正确答案等。 享受这一天 哈利：

这个代码对我很有用

.typed-cursor{
        opacity: 1;
        font-weight: 100;
        -webkit-animation: blink 0.7s infinite;
        -moz-animation: blink 0.7s infinite;
        -ms-animation: blink 0.7s infinite;
        -o-animation: blink 0.7s infinite;
        animation: blink 0.7s infinite;
    }

---

我希望这会有所帮助。对我来说很好

.typed-cursor {
    -webkit-animation: blinker 1s linear infinite;
            animation: blinker 1s linear infinite;
}

@-webkit-keyframes blinker {
    50% {
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    }
}

@keyframes blinker {
    50% {
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    }
}

---

我也试图解决这个问题，但我找到了类似的答案。希望这能奏效

.your-class:after{
    visibility: visible;
    content: '';
    background-color: #fff;
    display: inline-block;
    position: relative;
    width: 2px;
    height: 1em;
    top: 5px;
    margin-left: 3px; }

---

这就是我的工作原理：

 .typed-cursor {
        opacity: 1;
        animation: blink .7s infinite;
    }

    @keyframes blink {
        0% {
            opacity: 1;
        }
        50% {
            opacity: 0;
        }
        100% {
            opacity: 1;
        }
    }