Home / Questions / 74227
Accepted
simon
Asked: 2020-05-30 16:01:44 +0800 CST 2020-05-30 16:01:44 +0800 CST

How to make the animation slow

  • 772

Hello friends I have the following code I use the JQuery library and I need to slow down the animation of the writing of the animation I want it to look slow but not too slow, does anyone know how I could do that? or do you know a part of the Jquery docs to be able to do it?

<!DOCTYPE html>
<html>
<head>
	<title>Text</title>
	<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
	<script type="text/javascript" src="https://cdn.bootcss.com/typed.js/1.1.4/typed.min.js"></script>
	<style type="text/css">
		.write{
			font-size: 22px;
		}
		.container{
			text-align: center;
		}
	</style>
</head>
<body>

<div class="container">
	<span class="write"></span>
</div>

<script type="text/javascript">
	$(function(){
        $(".write").typed({
            strings: ["Bienvenidos a A nuestra  web", "Gracias por visitar nuestra Web"],
            typeSpeed: 4,
        });
    });
</script>

</body>
</html>

I use the Jquery library and typed.JS

jquery

1 Answers

  1. Best Answer

    Just write a slightly higher typeSpeed ​​value, in multiples of 100 I would say.

    <!DOCTYPE html>
<html>
<head>
	<title>Text</title>
	<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
	<script type="text/javascript" src="https://cdn.bootcss.com/typed.js/1.1.4/typed.min.js"></script>
	<style type="text/css">
		.write{
			font-size: 22px;
		}
		.container{
			text-align: center;
		}
	</style>
</head>
<body>

<div class="container">
	<span class="write"></span>
</div>

<script type="text/javascript">
	$(function(){
        $(".write").typed({
            strings: ["Bienvenidos a A nuestra  web", "Gracias por visitar nuestra Web"],
            typeSpeed: 300,
        });
    });
</script>

</body>
</html>

    • 3