<!DOCTYPE html>
< html lang = "en-US" >
< head >
< meta charset = "utf-8" / >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0, user-scalable=yes" / >
< title > welcome< / title >
< link rel = "icon" href = "imgs/avatars/ball2.gif" >
< link rel = "stylesheet" href = "index.css" >
< / head >
< body >
< div class = "introtext" >
It looks like you have been summoned by the oracle (< img src = "imgs/avatars/ball1.png" height = "70px" > ,< img src = "imgs/avatars/ball2.gif" height = "70px" > ,< img src = "imgs/avatars/ball4.gif" height = "70px" > ).
You will be asked to start a journey: throughout it you will be called
< form name = "nameForm" >
< input id = "player_name" type = "text" placeholder = "enter you name" >
< / form > .
You can decide whether you are going to look like
< form id = "avatar_form" >
< input type = "radio" id = "player1" name = "player_avatar" value = "imgs/avatars/avatar1.gif" >
< label for = "player1" > < img id = "player_img_1" src = "imgs/avatars/avatar1.gif" height = "70px" > < / label >
,
< input type = "radio" id = "player2" name = "player_avatar" value = "imgs/avatars/avatar2.gif" >
< label for = "player2" > < img id = "player_img_2" src = "imgs/avatars/avatar2.gif" height = "70px" > < / label >
,
< input type = "radio" id = "player3" name = "player_avatar" value = "imgs/avatars/avatar3.gif" >
< label for = "player3" > < img id = "player_img_3" src = "imgs/avatars/avatar3.gif" height = "70px" > < / label >
,
< input type = "radio" id = "player4" name = "player_avatar" value = "imgs/avatars/avatar4.gif" >
< label for = "player4" > < img id = "player_img_4" src = "imgs/avatars/avatar4.gif" height = "70px" > < / label >
,
< input type = "radio" id = "player5" name = "player_avatar" value = "imgs/avatars/avatar5.gif" >
< label for = "player5" > < img id = "player_img_5" src = "imgs/avatars/avatar5.gif" height = "70px" > < / label >
,
< input type = "radio" id = "player6" name = "player_avatar" value = "imgs/avatars/avatar6.gif" >
< label for = "player6" > < img id = "player_img_6" src = "imgs/avatars/avatar6.gif" height = "70px" > < / label >
,
< input type = "radio" id = "player7" name = "player_avatar" value = "imgs/avatars/avatar7.gif" >
< label for = "player7" > < img id = "player_img_7" src = "imgs/avatars/avatar7.gif" height = "70px" > < / label >
,
< input type = "radio" id = "player8" name = "player_avatar" value = "imgs/avatars/avatar8.gif" >
< label for = "player8" > < img id = "player_img_8" src = "imgs/avatars/avatar8.gif" height = "70px" > < / label >
,
< input type = "radio" id = "player9" name = "player_avatar" value = "imgs/avatars/avatar9.gif" >
< label for = "player9" > < img id = "player_img_9" src = "imgs/avatars/avatar9.gif" height = "70px" > < / label >
,
< input type = "radio" id = "player10" name = "player_avatar" value = "imgs/avatars/avatar10.gif" >
< label for = "player10" > < img id = "player_img_10" src = "imgs/avatars/avatar10.gif" height = "70px" > < / label >
,
< input type = "radio" id = "player11" name = "player_avatar" value = "imgs/avatars/avatar11.gif" >
< label for = "player11" > < img id = "player_img_11" src = "imgs/avatars/avatar11.gif" height = "70px" > < / label >
or like
< input type = "radio" id = "player12" name = "player_avatar" value = "imgs/avatars/avatar12.gif" >
< label for = "player12" > < img id = "player_img_12" src = "imgs/avatars/avatar12.gif" height = "70px" > < / label >
.
< / form >
You can press
< button id = "gotostart" onclick = "storeName()" > start< / button >
when you are ready.
< / div >
< script src = "jquery.min.js" > < / script >
< script type = "text/javascript" src = "index.js" > < / script >
< / body >