Javascript Code To Start Your Game:
            function startGame(hitpoints) {
                var name = prompt("What is your name, vampire?");
                localStorage["name"] = name;
                localStorage[name + ".hitpoints"] = hitpoints;
                window.location.href = "index2.html";
            }
HTML Code To Start Your Game:

<a href="#" onclick="startGame(50)">Start Game</a>
 
<!-- where 50 is the number of hitpoints for the player to start your game -->

HTML Code To Print Your Name:

<script type="text/javascript">document.write(localStorage["name"]);</script>
Javascript for Adding Items To Inventory:
            function addItemToInventory(item) {
                alert("You got a " + item.name + "!");
                var name = localStorage["name"];
 
                var stringInvOld = localStorage[name + ".inventory"];
 
                var inventory = [];
                if(typeof stringInvOld !== "undefined") {
                    inventory = JSON.parse(stringInvOld);
                }
 
                var isInInventory = 0;
 
                for (var i = 0; i < inventory.length; i++) {
 
                    if(inventory[i].name === item.name) {
                        inventory[i].quantity = inventory[i].quantity + 1;
                        isInInventory = 1;
                    }
                }
                if (isInInventory === 0) {
                    item.quantity = 1;
                    inventory.push(item);
                }
 
                var stringInventory = JSON.stringify(inventory);
                localStorage[name + ".inventory"] = stringInventory;
 
            }
HTML For Adding Item To Inventory:

                    <a href="#" onclick="addItemToInventory({ name:'banana' } )">
                                Get a banana
                    </a>

Javascript for Checking Inventory:
            function getItemsFromInventory() {
                var name = localStorage["name"];
                return JSON.parse(localStorage[name + ".inventory"]);
            }


HTML for Checking Inventory:

            <table>
                <tr>
                    <th>Name</th>
                    <th>Quantity</th>
                </tr>
 
 
            <script type="text/javascript">
                var inventory = getItemsFromInventory();
                for (var i = 0; i < inventory.length; i++) {
                    document.write("<tr><td>" + inventory[i].name + "<td><td>" + inventory[i].quantity + "</td></tr>");
                }
 
            </script>
            </table>
Javascript for Dropping an Inventory Item:

            function dropItem (itemName) {
 
                var name = localStorage["name"];
 
                var invString = localStorage[name + ".inventory"];
                var inventory = [];
                if(typeof invString !== "undefined") {
                    inventory = JSON.parse(invString);
                }
                else {
                    return;
                }
                for (var i = 0; i < inventory.length; i++) {
 
                    if(inventory[i].name === itemName) {
                        if (inventory[i].quantity > 1) {
                            inventory[i].quantity = inventory[i].quantity - 1;
                        }
                        else {
                            inventory.splice(i,1);
 
                        }
                        alert("You have dropped a " + itemName + "!");
                        var stringInvNew = JSON.stringify(inventory);
                        localStorage[name + ".inventory"] = stringInvNew;
                        return;
                    }
                }
                alert("You have to get a " + itemName + " to drop it!");
            }
HTML for dropping an item:
                    <a href="#" onclick="dropItem('banana');">
                                Drop a banana
                    </a>

Javascript for making a popup window:
function newPopup(url) {
    popupWindow = window.open(
        url,'popUpWindow','height=700,width=800,left=10,top=10,resizable=yes,scrollbars=yes,toolbar=yes,menubar=n0,location=no,directories=no,status=yes')
}

HTML for making a popup window for inventory:

<a href="JavaScript:newPopup('inventory.html');">Check inventory</a>
Javascript Weapons Code:

            function addWeapon(weapon) {
                alert("You got a " + weapon.name + "!");
                var name = localStorage["name"];
 
                var stringWeaponOld = localStorage[name + ".weapons"];
 
                var weapons = [];
                if(typeof stringWeaponOld !== "undefined") {
                    weapons = JSON.parse(stringWeaponOld);
                }
 
                var isInWeapons = 0;
 
                for (var i = 0; i < weapons.length; i++) {
 
                    if(weapons[i].name === weapon.name) {
                        weapons[i].quantity = weapons[i].quantity + 1;
                        isInWeapons = 1;
                    }
                }
                if (isInWeapons === 0) {
                    weapon.quantity = 1;
                    weapons.push(weapon);
                }
 
                var stringWeapons = JSON.stringify(weapons);
                localStorage[name + ".weapons"] = stringWeapons;
 
            }
 
            function getWeapons() {
                var name = localStorage["name"];
                return JSON.parse(localStorage[name + ".weapons"]);
            }
 
            function pickWeapon() {
                 var name = localStorage["name"];
 
                 var weapons = JSON.parse(localStorage[name + ".weapons"]);
                 for (var i = 0; i < weapons.length; i++) {
                        var pick = prompt("Would you like to use the " + weapons[i].name + ", damage " + weapons[i].damage + "?");
                        if(pick === "yes") {
                            alert("You are using the " + weapons[i].name + "!");
                            return weapons[i];
                        }
                }
                /* just return the first one if they didnt pick */
                alert("You are using the " + weapons[0].name + "!");
                return weapons[0];
            }
 
HTML Code for Adding Weapon:

                    <a href="#" onclick="addWeapon({ name:'cool sword', damage:5})">
                            Get a Cool Sword!
                    </a>



HTML Code for Making a Popup Window to Check Weapons:
<a href="JavaScript:newPopup('weapons.html');">Check weapons</a>
HTML Code for Check Weapons Page:

           <table>
                <tr>
                    <th>Name</th>
                    <th>Damage</th>
                </tr>
 
 
            <script type="text/javascript">
                var weapons = getWeapons();
                for (var i = 0; i < weapons.length; i++) {
                    document.write("<tr><td>" + weapons[i].name + "<td><td>" + weapons[i].damage + "</td></tr>");
                }
 
            </script>
            </table>
Javascript Code To Change in startGame() to start with a weapon:
<!-- add this after the localStorage[] stuff -->
 
addWeapon({name: "regular sword", damage: 1});
 
 
 
Javascript Code to Drop Weapon:

             function dropWeapon(weaponName) {
 
                var name = localStorage["name"];
 
                var weaponsString = localStorage[name + ".weapons"];
                var weapons = [];
                if(typeof weaponsString !== "undefined") {
                    weapons = JSON.parse(weaponsString);
                }
                else {
                    return;
                }
                for (var i = 0; i < weapons.length; i++) {
 
                    if(weapons[i].name === weaponName) {
                        if (weapons[i].quantity > 1) {
                            weapons[i].quantity = weapons[i].quantity - 1;
                        }
                        else {
                            weapons.splice(i,1);
 
                        }
                        var stringWeaponsNew = JSON.stringify(weapons);
                        localStorage[name + ".weapons"] = stringWeaponsNew;
                        alert("You have dropped a " + weaponName + "!");
                        return;
                    }
                }
                alert("You have to get a " + weaponName + " to drop it!");
            }
HTML Code To Drop Weapon:

                    <a href="#" onclick="dropWeapon('cool sword');">
                            Drop a Cool Sword!
                    </a>



Javascript Code To Change In fightMonster() to Pick Weapon:

<!-- put this after the alert("You are fighting the ...");
 
var weapon = pickWeapon();
 
<!-- change the monster damage -->
 
monsterHitPoints = monsterHitPoints - weapon.damage;

Javascript to Drop All Stuff At The Beginning Of The Game:


<!-- add this after the localStorage[name + ".hitpoints"] = hitpoints; line of startGame()-->
localStorage.removeItem(name + ".weapons");
localStorage.removeItem(name + ".inventory");

Javascript for fightMonster() that STORES YOUR HITPOINTS!!!!

function fightMonster(weaponDamage,monsterBadness, monsterHitPoints) {
alert("You are fighting the dreaded monster!");
 
var name = localStorage["name"];
var hitpoints = localStorage[name + ".hitpoints"];
 
while (hitpoints > 0 && monsterHitPoints > 0) {
var randomNumber = Math.random() * 10;
if(randomNumber > monsterBadness) {
monsterHitPoints = monsterHitPoints - weaponDamage;
alert("You have hit the monster! He has " + monsterHitPoints + " hitpoints left!");
}
else {
hitpoints = hitpoints - 1;
localStorage[name + ".hitpoints"] = hitpoints;
 
alert("The monster hit you! You have " + hitpoints + " hitpoints left!");
}
 
}
if (hitpoints > 0) {
alert("You have defeated the monster!");
/* window.location.href("frank.html"); */
}
else {
alert("You have died. Back to the beginning!");
/* window.location.href("index.html"); */
}
}
 

CSS to make boxes on your site like my Vampire game:

/*
    Document   : stylesheet
    Created on : 16-Jul-2013, 2:10:33 PM
    Author     : LLC
    Description:
        Purpose of the stylesheet follows.
*/
 
body {
    background-color: #CDCDFF;
}
p {
    color: blue;
}
a:link {
    color: #FFFFFF;
}
a:visited {
    color: #FFFFFF;
}
a:hover {
    color: #FFFFFF;
}
a:active {
    color: #FFFFFF;
}
#storyname {
    position: absolute;
    left: 200px;
    top: 20px;
    height: 150px;
    width: 600px;
    background-color: #0531BF;
    border-radius: 5px;
    padding: 10px 10px 10px 10px;
    border-color: black;
    border-width: 1px;
    border-style: solid;
    color: #93ACFC;
    text-shadow: 2px 2px #626262;
    font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
    text-align: center;
    z-index: 4;
}
#story {
    position: absolute;
    left:255px;
    top:195px;
    width: 600px;
    height: 200px;
    background-color: #3F4F84;
    border-radius: 5px;
    padding: 10px 10px 10px 10px;
    z-index: 5;
    border-color: black;
    border-width: 1px;
    border-style: solid;
 
/*    visibility: hidden; */
}
p {
    color: #A6BBF8;
}
#picture {
    position: absolute;
    left: 50px;
    top: 195px;
    background-color: red;
    height: 200px;
    width: 180px;
    border-radius: 5px;
    padding: 10px 10px 10px 10px;
    z-index: 5;
    background-color: #93ACFC;
    border-color: black;
    border-width: 1px;
    border-style: solid;
}
#links {
    position: absolute;
    left: 855px;
    top: 355px;
    width: 200px;
    background-color: #0531BF;
    border-radius: 5px;
    padding: 10px 10px 10px 10px;
    border-color: #626262;
    color: #A6BBF8;
    font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
    z-index: 6;
        border-color: black;
    border-width: 1px;
    border-style: solid;
}
#inventory {
    display: block;
   background-color: #0531BF;
    border-radius: 5px;
    padding: 10px 10px 10px 10px;
    border-color: #626262;
    color: #A6BBF8;
    font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
    z-index: 6;
        border-color: black;
    border-width: 1px;
    border-style: solid;
}
#inventory table,th{
    background-color: #5F686B;
    border: 1px solid black;
 
}