Welcome! To play this Code Breakers Challenge, please be sure to use Google Chrome
We will be working with JavaScript to hunt for clues hidden on this website
To begin the challenge, right click on the page and select "Inspect" or "Inspect Element"
If that doesn't work, press CTRL + Shift + "J" on Windows or CMD + Shift + "J" on Mac
Click on the tab that says "Console"
In this area, type begin()
Congrats! You've just used a Function
A Function tells JavaScript to do some tasks
Any word that's followed by parenthesis () is a function
Next, we will use the css() function together with a selector. We'll go over selectors in a moment
Type the following into the Console:
$('#mario').css('display', 'block')
You can also copy and paste this selector and function into the Console
(Whatever you do, don't click the Win Button!)
You found me!
You just selected me by using my ID
Any word that follows the # symbol is an element's unique ID
We can use IDs to talk to a part of a website using JavaScript
For the next clue, click on Minecraft Animators
Cool! So let's give this a try on your own
Select the element with an ID of luigi and use this function
.css('display', 'block')
If you are stuck, type help1 into the Console
Remember, to select an element, use $('#element_id')
Hello!
So far we have learned how to use Selectors and Functions
As a reminder, we use selectors like this: $('#element_id')
and we use functions like this: someFunctionName()
We can combine them with a period to run a function on the selection
For the next step, click on the course Code Breakers below
But be careful! I heard Bowser and his gang were lurking around here
Much better!
Now that everything is working, let's go play some Tennis
Use the function playTennis to begin
Remember, functions end with ()
Good work! Peach showed up, but it looks like she was shrunken!
Let's use the css function again, but this time we will change the height property
Use a selector for the ID peach and run the function .css('height', '250px')
For a hint, type help3 into the Console
Oh man! Now a Koopa is here
Let's try to knock his shell off
use a function called jumpOnKoopa
Remember, functions end with ()
Good job!
Now let's go play some Tennis...
Oh man, the Koopa came back with his friends
Quick, let's hop in our go-kart and get out of here!
Use the function goKart
We finally made it to the tennis court!
While we wait for Mario, let's review selectors
Using the id of 'thisText', let's change the color of this sentence
Use a selector and run the css function to set color to blue
Hint: the CSS function is written like this: .css('style', 'value')
If you are stuck, type help4 in the Console for help
Oh no! While we were waiting, Bowser showed up.
This is it, let's defeat him once and for all
Let's try using a power up
Use the function powerUp
Remember, functions end with ()
Well Done!
You've defeated Bowser using the power of code
Let's go use our new powers to learn some more
Minecraft® Animators
Use your favorite Minecraft® characters to create your own animated short film!
MakerLab: First 3D Creation
Learn how to create your own 3D objects and models from scratch!
Minecraft® Modders
Modify and create your own Minecraft® characters, tools, mobs, and more!
App Attack!
Dive into making your own apps, just like the ones you’d see on the App Store!
Minecraft® Designers
Fill a Minecraft® world with your own custom designs and creations!
Code Breakers
Learn how to use code in making your ideas become reality!
Girl Gamers
Why should boys have all the fun? There's plenty of exciting games that girls can make in this course!
Make Your First Video Game!
Create your first platformer video game using characters that you choose!
Make Your First 3D Video Game!
Make your own fun and challenging 3D game with industry grade software!
Video Game Odyssey
Learn the art of building your own web enabled games done right in your browser.
Video Game Animation
Dive into making sprites move around and animate in a video game!
App Adventures: The Next Level!
Take a step further in mobile app creation and bring your ideas to life!
LEGO® Video Games
Create an awesome video game adventure with your own LEGO® characters!
LEGO® YOUniverse
Make your own visual story for your favorite LEGO® characters.
LEGO® Films & Stop Action
Create your own short film using your favorite LEGO® toys and characters!
Digital Storytellers
Design a storyboard and create your own digital tale where you’re the star!
Creative Design and Robotics
Harness the power of robotics by learning how to build and program bots!
*All classes are 9am to 4pm M-Th
**Ages 7 -11
***6/08 and 7/05 are shortened weeks.
We use cookies to improve your experience on our site. By using our site, you consent to cookies.
This website uses cookies
Websites store cookies to enhance functionality and personalise your experience. You can manage your preferences, but blocking some cookies may impact site performance and services.
Essential cookies enable basic functions and are necessary for the proper function of the website.
Name
Description
Duration
Cookie Preferences
This cookie is used to store the user's cookie consent preferences.
30 days
Google Tag Manager simplifies the management of marketing tags on your website without code changes.
Name
Description
Duration
cookiePreferences
Registers cookie preferences of a user
2 years
td
Registers statistical data on users' behaviour on the website. Used for internal analytics by the website operator.
session
Statistics cookies collect information anonymously. This information helps us understand how visitors use our website.
Google Analytics is a powerful tool that tracks and analyzes website traffic for informed marketing decisions.
Used by Google Analytics to determine which links on a page are being clicked
30 seconds
_gat
Used to monitor number of Google Analytics server requests when using Google Tag Manager
1 minute
_gid
ID used to identify users for 24 hours after last activity
24 hours
_ga_
ID used to identify users
2 years
_ga
ID used to identify users
2 years
__utmx
Used to determine whether a user is included in an A / B or Multivariate test.
18 months
__utmv
Contains custom information set by the web developer via the _setCustomVar method in Google Analytics. This cookie is updated every time new data is sent to the Google Analytics server.
2 years after last activity
__utmz
Contains information about the traffic source or campaign that directed user to the website. The cookie is set when the GA.js javascript is loaded and updated when data is sent to the Google Anaytics server
6 months after last activity
__utmc
Used only with old Urchin versions of Google Analytics and not with GA.js. Was used to distinguish between new sessions and visits at the end of a session.
End of session (browser)
__utmb
Used to distinguish new sessions and visits. This cookie is set when the GA.js javascript library is loaded and there is no existing __utmb cookie. The cookie is updated every time data is sent to the Google Analytics server.
30 minutes after last activity
_gac_
Contains information related to marketing campaigns of the user. These are shared with Google AdWords / Google Ads when the Google Ads and Google Analytics accounts are linked together.
90 days
__utmt
Used to monitor number of Google Analytics server requests
10 minutes
__utma
ID used to identify users and sessions
2 years after last activity
Vimeo is a video hosting platform for high-quality content, ideal for creators and businesses to showcase their work.
.png/revision/latest?cb=20130617011001)
