Reader small image

You're reading from  JavaScript from Beginner to Professional

Product typeBook
Published inDec 2021
Reading LevelBeginner
PublisherPackt
ISBN-139781800562523
Edition1st Edition
Languages
Tools
Right arrow
Authors (3):
Laurence Lars Svekis
Laurence Lars Svekis
author image
Laurence Lars Svekis

Laurence Svekis is an experienced web application developer. He has worked on multiple enterprise-level applications, hundreds of websites, business solutions, and many unique and innovative web applications. He has expertise in HTML, CSS, JavaScript, jQuery, Bootstrap, PHP, and MySQL and is also passionate about web technologies, web application development, programming, and online marketing with a strong focus on social media and SEO. He is always willing to help his students experience what technology has to offer and looks forward to sharing his knowledge and experiences with the world.
Read more about Laurence Lars Svekis

Maaike van Putten
Maaike van Putten
author image
Maaike van Putten

Maaike is a software consultant and trainer with a passion for sharing her expertise to empower others in their careers. Her love for software development shows in the numerous software development projects she participated in and the many certifications she obtained. She has designed and delivered a broad spectrum of training courses catering to beginners and seasoned developers in Java, Python, C# and many other languages and frameworks. Next to that, she has authored multiple books and online courses through multiple platforms reaching over 500,000 learners across the globe.
Read more about Maaike van Putten

Codestars By Rob Percival
Codestars By Rob Percival
author image
Codestars By Rob Percival

Rob Percival is a highly regarded web developer and Udemy instructor with over 1.7 million students. Over 500,000 of them have taken Rob's Complete Web Developer Course 2.0, as well as his Android Developer and iOS Developer courses.
Read more about Codestars By Rob Percival

View More author details
Right arrow

Animating elements

Lastly, we want to show you that you can animate using HTML, CSS, and JavaScript. This allows us to do even cooler things with our web page. For example, we can trigger an animation as an event. This can be used for many different purposes, for example, to illustrate an explanation, to draw the user's eyes to a certain location, or to play a game.

Let's show you a very basic example. We can use the position key and set it to absolute in CSS. This makes the position of the element relative to its nearest positioned parent. Here, that would be the body. This is the code for a purple square that moves from left to right when a button is clicked.

<!doctype html>
<html>
  <style>
    div {
      background-color: purple;
      width: 100px;
      height: 100px;
      position: absolute;
    }
  </style>
  <body>
    <button onclick="toTheRight()">Go right</button>
    <div id="block">...
lock icon
The rest of the page is locked
Previous PageNext Page
You have been reading a chapter from
JavaScript from Beginner to Professional
Published in: Dec 2021Publisher: PacktISBN-13: 9781800562523

Authors (3)

author image
Laurence Lars Svekis

Laurence Svekis is an experienced web application developer. He has worked on multiple enterprise-level applications, hundreds of websites, business solutions, and many unique and innovative web applications. He has expertise in HTML, CSS, JavaScript, jQuery, Bootstrap, PHP, and MySQL and is also passionate about web technologies, web application development, programming, and online marketing with a strong focus on social media and SEO. He is always willing to help his students experience what technology has to offer and looks forward to sharing his knowledge and experiences with the world.
Read more about Laurence Lars Svekis

author image
Maaike van Putten

Maaike is a software consultant and trainer with a passion for sharing her expertise to empower others in their careers. Her love for software development shows in the numerous software development projects she participated in and the many certifications she obtained. She has designed and delivered a broad spectrum of training courses catering to beginners and seasoned developers in Java, Python, C# and many other languages and frameworks. Next to that, she has authored multiple books and online courses through multiple platforms reaching over 500,000 learners across the globe.
Read more about Maaike van Putten

author image
Codestars By Rob Percival

Rob Percival is a highly regarded web developer and Udemy instructor with over 1.7 million students. Over 500,000 of them have taken Rob's Complete Web Developer Course 2.0, as well as his Android Developer and iOS Developer courses.
Read more about Codestars By Rob Percival