<!DOCTYPE html>
<html>
<style >
.element{
font-size: 100px
}
.typed-cursor{
font-size: 100px
opacity: 1;
-webkit-animation: blink 0.7s infinite;
-moz-animation: blink 0.7s infinite;
animation: blink 0.7s infinite;
}
@keyframes blink{
10% { opacity:1; }
50% { opacity:0; }
100% { opacity:1; }
}
@-webkit-keyframes blink{
10% { opacity:1; }
50% { opacity:0; }
100% { opacity:1; }
}
@-moz-keyframes blink{
10% { opacity:1; }
50% { opacity:0; }
100% { opacity:1; }
}
</style>
<head>
<script src="jquery-2.1.4.js"></script>
<script type="text/javascript" src="typed.js"></script>
</head>
<body>
<span class = "element">
<script>
$(function(){
$(".element").typed({
strings: ["agdsgdggd","okay"],
typeSpeed: 100,
loop: true,
cursorChar: "|",
});
});
</script>
</span>
</body>
</html>
所以我使我的元素跨度有一个默认的文本大小,它修改了文本,但是光标没有改变。我试图在css中设置游标大小,但似乎没有工作。也许有人知道我失踪的伎俩。谢谢。
答案 0 :(得分:6)
我回答了自己的问题。这是使文本和光标的大小相同的解决方案,用于键入的javascript库,
前
.typed-cursor{
font-size: 100px
opacity: 1;
-webkit-animation: blink 0.7s infinite;
-moz-animation: blink 0.7s infinite;
animation: blink 0.7s infinite;
}
忘记字体大小的半冒号
.typed-cursor{
font-size: 100px;
opacity: 1;
-webkit-animation: blink 0.7s infinite;
-moz-animation: blink 0.7s infinite;
animation: blink 0.7s infinite;
}
立即行动。