Hey everyone, I am new to javascript and I am just starting to make a new site and I am trying to put two different codes of javascript into it. The first page is called Default.aspx and I have a side bar. This sidebar is working perfectly and as soon as I try to insert more javascript for something else everything stops working and I get an error for the sidebar. If I have just the sidebar code everything works perfectly. So that is how I have it right now.
I am trying to put a navigation bar on a different page, this page is Site.Master. Everything is referenced (not sure if it is correct, thats why I am here!) and when I run it I get a runtime error and then it finds something wrong with the sidebar on a different page! I can't really tell you the error because now my localhost is freezing whenever I run it. But the error is a runtime error. If you could just tell me if the code looks good, or if I am forgetting some kind of trick.
The sidebar code is in a seperate file and I am calling for it in the Default.aspx file. Here is the code, and hopefully someone can help me out!
Thanks a lot everyone!
Default.aspx
Code:
<%@ Page Title="Home Page" Language="VB" MasterPageFile="~/Site.Master" AutoEventWireup="false"
CodeFile="Default.aspx.vb" Inherits="_Default" %>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="Stylesheet" type="text/css" href="Styles/fbload.css" />
<link rel="Stylesheet" type="text/css" href="Styles/Site.css" />
<script type="text/javascript" src="Scripts/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="Scripts/jquery.easing.js"></script>
<script type="text/javascript" src="Scripts/jquery.sweet-menu-1.0.js"></script>
<script type="text/javascript" src="JavaScript/SideBar.js"> </script>
<style type="text/css">
body
{
background: #000000 url('images/bgWebs.png') top center;
}
.sweetMenuAnchor
{
border-top: 1px solid #ffffff;
border-right: 1px solid #ffffff;
border-bottom: 1px solid #ffffff;
border-top-right-radius: 4px;
-mox-border-radius-topright: 4px;
border-bottom-right-radius: 4px;
-moz-border-radius-bottomright: 4px;
color: #0071bb;
font-size: 24px;
font-weight: bold;
text-align: right;
text-transform: uppercase;
font-family: Arial;
text-decoration: none;
background-color: #888888;
opacity: 0.6;
}
.sweetMenuAnchor span
{
display: block;
padding-top: 10px;
}
h1
{
display: block;
text-align: center;
font-size: 48px;
color: #ffffff;
text-shadow: 0px 0px 12px #000000;
font-family: "Trebuchet MS";
}
</style>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<h2>
Welcome to ASP.NET!
</h2>
<div id="classytabs">
<ul class="tabs">
<li><a href="#about" class="first selected" title="About">About</a></li>
<li><a href="#portfolio" title="Portfolio">Portfolio</a></li>
<li><a href="#contact" title="Contact">Contact</a></li>
<li><a href="#help" title="Help">Help</a></li>
</ul>
<div class="clearfix">
</div>
<div id="tabs content" class="tab-contents">
<div id="about" class="tab-content">
just a test.
</div>
<div id='pages'>
</div>
</div>
</div>
<ul id="backMenu">
<li><a href="http://www.adambecker.info/playground/sweet-menu">Order Now!</a></li>
</ul>
<ul id="exampleMenu">
<li><a href="#home">Home</a></li>
<li><a href="#home">Blog</a></li>
<li><a href="#home">Portfolio</a></li>
<li><a href="#home">Hire Me</a></li>
<li><a href="#home">Contact</a></li>
<li><a href="#home">My Apps</a></li>
</ul>
<h1>Sweet menu demo</h1>
<p> </p><p> </p><p> </p><p> </p><p> </p><p> </p>
<p> </p><p> </p><p> </p><p> </p><p> </p><p> </p>
<p> </p><p> </p><p> </p><p> </p><p> </p><p> </p>
<p> </p><p> </p><p> </p><p> </p><p> </p><p> </p>
<p> </p><p> </p><p> </p><p> </p><p> </p><p> </p>
<p> </p><p> </p><p> </p><p> </p><p> </p><p> </p>
<p> </p><p> </p><p> </p><p> </p><p> </p><p> </p>
<p> </p><p> </p><p> </p><p> </p><p> </p><p> </p>
<p>
To learn more about ASP.NET visit <a href="http://www.asp.net" title="ASP.NET Website">www.asp.net</a>.
</p>
<p>
You can also find <a href="http://go.microsoft.com/fwlink/?LinkID=152368&clcid=0x409"
title="MSDN ASP.NET Docs">documentation on ASP.NET at MSDN</a>.
</p>
</asp:Content>
sideBar.js
Code:
$(document).ready(function () {
$('#backMenu').sweetMenu({
top: 40,
padding: 8,
iconSize: 48,
easing: 'easeOutBounce',
duration: 500,
icons: [
'images/back.png']
});
$('#exampleMenu').sweetMenu({
top: 200,
padding: 8,
iconSize: 48,
easing: 'easeOutBounce',
duration: 500,
icons: [
'images/home.png',
'images/comments.png',
'images/red_heart.png',
'images/male_user.png',
'images/yellow_mail.png',
'images/computer.png'
]
});
});
Site.Master
Code:
<%@ Master Language="VB" AutoEventWireup="false" CodeFile="Site.Master.vb" Inherits="Site" %>
<!DOCTYPE html Transitional "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head id="Head1" runat="server">
<title></title>
<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
<link href="~/Styles/reset.css" rel="Stylesheet" type="text/css" media="screen" />
<link href="~/Styles/dark.css" rel="Stylesheet" type="text/css" media="screen"" />
<script type="text/javascript" src="Scripts/jquery-1.4.min.js"></script>
<script type="text/javascript" src="Scripts/jquery.easing.min.js"></script>
<script type="text/javascript" src="Scripts/jquery.lavalamp.min.js"></script>
<script type="text/javascript" src="Scripts/cufon.yui.js"></script>
<script type="text/javascript" src="Scripts/myriad.js"></script>
<script type="text/javascript">
$(function () {
$("#one,#two,#three,#four,#five,#six,#seven,#eight").lavaLamp({
fx: "backout",
speed: 700
});
});
</script>
<script type="text/javascript">
Cufon.replace('li a', { hover: true });
</script>
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form runat="server">
<div class="page">
<div class="header">
<img src="images/webBanner.jpg" style="width: 952px; height: 108px" alt="Adirondack Title Searching" />
<div id="wrapper">
<div class="darkmenu">
<ul class="darkGreen" id="six">
<li class="current"><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">News</a></li>
</ul>
<div class="searchbox">
<form method="get" action="">
<input type="text" value="" onfocus="doClear(this)" name="s" class="darksearch" />
</form>
</div>
</div>
</div>
</div>
<div class="main">
<asp:ContentPlaceHolder ID="MainContent" runat="server" />
</div>
<div class="clear">
</div>
<div class="footer">
</div>
</div>
</form>
</body>
</html>
If you need anything else just let me know! And all of the javascript scripts are being called for the actual scripts, not sure if there is something else I am suppose to be giving a source for!
Thanks in advance and let me know if you need anything else.
Before you post, read our: 
