Interactivity with JavaScript and jQuery

This course is part of JavaScript for Beginners Specialization

Instructor: William Mead

Access provided by Somaiya Vidyavihar University

7,841 already enrolled

4 modules

Gain insight into a topic and learn the fundamentals.

64 reviews

2 weeks to complete

at 10 hours a week

Flexible schedule

Learn at your own pace

4 modules

Gain insight into a topic and learn the fundamentals.

64 reviews

2 weeks to complete

at 10 hours a week

Flexible schedule

Learn at your own pace

Skills you'll gain

Tools you'll learn

Details to know

Shareable certificate

Add to your LinkedIn profile

Assessments

5 assignments

Taught in English

See how employees at top companies are mastering in-demand skills

Learn more about Coursera for Business

logos of Petrobras, TATA, Danone, Capgemini, P&G and L'Oreal

Build your subject-matter expertise

This course is part of the JavaScript for Beginners Specialization

When you enroll in this course, you'll also be enrolled in this Specialization.

Learn new concepts from industry experts
Gain a foundational understanding of a subject or tool
Develop job-relevant skills with hands-on projects
Earn a shareable career certificate

There are 4 modules in this course

This course is the third in our JavaScript for Beginners Specialization. The scripts will become more complex and introduce more complex jQuery plugins. You will have several challenges to practice your skills throughout the course. The course objectives include how to identify objects in JavaScript; create new objects and populate them with data; manipulate objects by adding, modifying and deleting data in objects; manipulate the DOM based on the data in objects; identify and articulate how multiple functions work together to create a more complex program; and identify processes for breaking larger programs into smaller, more manageable pieces.

In this module, you will be introduced to jQuery plugins and be able to present the advantages and challenges associated with using jQuery plugins. You will also be able to recognize common mistakes to avoid when using jQuery plugins. You will be introduced to the Flexslider jQuery plugin and be able to use it to build basic and more advanced image sliders.

What's included

13 videos4 readings1 assignment2 discussion prompts

13 videos Total 71 minutes

Welcome to this Course! 1 minute
Module Introduction 1 minute
Introduction to jQuery Plugins 4 minutes
Using Plugins and Essential Steps 4 minutes
Gotchas and Rookie Mistakes 9 minutes
FlexSlider: A jQuery Plugin 7 minutes
About the Minified Version 6 minutes
Adding Markup & Hooking Up the Slider 8 minutes
FlexSlider Rules 7 minutes
Additional Controls 8 minutes
Advanced FlexSlider 4 minutes
Additional Styling 6 minutes
Styling the CTA 8 minutes

4 readings Total 40 minutes

A Note From UC Davis 10 minutes
PDF of Presentation 10 minutes
Start Files: jQuery Plugins & Flexslider 10 minutes
PDF of Presentation 10 minutes

1 assignment Total 30 minutes

Module 1 Quiz 30 minutes

2 discussion prompts Total 20 minutes

Learning Goals 10 minutes
Module 1 Reflection 10 minutes

In this module, you will be able to use jQuery to create a smooth scroll effect for in-page navigation, as well as develop a script, using jQuery, that keeps track of scroll positions on the page.You will be able to compare and contrast the in-page smooth scroll script and the location tracking script created using jQuery with one created using plain JavaScript. You will be able to build a webpage using HTML and CSS that will combine some of the different scripts created in this course. You will be able to combine some of the different scripts and jQuery plugins explored in this course into the Scription webpage through a series of challenges.

What's included

39 videos8 readings2 assignments2 discussion prompts

39 videos Total 227 minutes

Module Introduction 1 minute
Introduction to Smooth Scroll with jQuery 4 minutes
Creating a Click Handler 5 minutes
Adding the Animation 7 minutes
Add Some Easing and a Callback Function 4 minutes
Highlighting Elements 5 minutes
Introduction to Page Location Tracking 8 minutes
The Crux of the Problem 6 minutes
Strategy 8 minutes
Adding PageTop and If Statements 6 minutes
Writing the Else/If Statement - Part 1 4 minutes
Writing the Else/If Statement - Part 2 6 minutes
Edge Case Issues 5 minutes
Resizing Your Windows 6 minutes
Resetting the Counter 5 minutes
resetPagePosition Function 9 minutes
Reviewing the Whole Script 6 minutes
Introduction to Scroll Effects with JS 6 minutes
Getting the Target - Part 1 5 minutes
Getting the Target - Part 2 5 minutes
Smooth Scroll Polyfill 5 minutes
Checking the Load 7 minutes
Top Posts 6 minutes
Add an Event Listener 6 minutes
The Magic Conditionals 6 minutes
Changing the Next Link 6 minutes
Resizing Function 5 minutes
Finalizing the Script 10 minutes
Scription Site Introduction 6 minutes
Header HTML 5 minutes
Pricing HTML 6 minutes
Beginning Styling 7 minutes
Styling That Attaches to Whole Page 5 minutes
Slider Styling 5 minutes
Pricing Styles 4 minutes
Tablet Styles 7 minutes
Media Query for 1020 Pixels Wide 5 minutes
Media Query for 1200 Pixels Wide 6 minutes
Scription Site: Building Interactive Elements Challenges 10 minutes

8 readings Total 110 minutes

Start Files: Smooth Scroll with jQuery 10 minutes
PDF of Presentation 10 minutes
PDF of Presentation 10 minutes
Start Files: Smooth Scroll with JavaScript 10 minutes
PDF of Presentation 10 minutes
Start Files: Scription Site 40 minutes
Scription Finished Version 10 minutes
PDF of Presentations 10 minutes

2 assignments Total 60 minutes

Module 2 Quiz 30 minutes
Honors Quiz 30 minutes

2 discussion prompts Total 20 minutes

Module 2 Reflection 10 minutes
Peer Support 10 minutes

In this module, you will be introduced to the object literal and be able to demonstrate some of the ways to manipulate data inside objects. You will be able to develop good habits and processes that help with thinking about how to solve a programming problem, including breaking a problem down into smaller pieces.

What's included

11 videos4 readings1 assignment1 discussion prompt

11 videos Total 56 minutes

Module Introduction 1 minute
Introduction to Objects and Data in JS 6 minutes
Objects Can Contain Arrays and Other Objects 5 minutes
Functions Inside Objects Equals Methods 6 minutes
Putting Objects and Functions Together 5 minutes
Data Formats - XML 4 minutes
Example File 7 minutes
Introduction to Pig Dice Game 6 minutes
Play the Game of Pig 5 minutes
Version One 4 minutes
Other Versions 7 minutes

4 readings Total 40 minutes

Start Files: Working with Objects in JavaScript 10 minutes
PDF of Presentations 10 minutes
Pig Dice Game Diagrams 10 minutes
PDF of Presentations 10 minutes

1 assignment Total 30 minutes

Module 3 Quiz 30 minutes

1 discussion prompt Total 10 minutes

Module 3 Reflection 10 minutes

By building this game within this module, you will be able to practice the JavaScript you have already learned while constructing a script with more functions and complexity. You will be able to then extend the script in many creative ways.