Firstly i am not a coder and do not know much about java or coding, But i am learning along the way

Anyway i have vbulletin forums and i am trying to install a mod but its not working

The mod uses jquery.js and bar,js files
ALL the files have been checked and they are uploaded to the correct paths
I have inserted the code in the exact place

The code has been placed in my "NAVBAR" template and is :

Code:
<!--- rocketDock Menu developed and Translated to Arabic By Twi[L]ighT Dz , www.shba7.cc/vb  -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>CSS Mac Dock</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/bar.js"></script>

<!--[if lt IE 7]>
 <style type="text/css">
 div, img { behavior: url(iepngfix.htc) }
 </style>
<![endif]-->

<link href="css/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="dock" id="dock">
  <div class="dock-container">
  <a class="dock-item" href="your link here"><img src="http://www.sitepoint.com/forums/images/home.png" alt="home" /><span>home</span></a> 
  <a class="dock-item" href="your link here"><img src="http://www.sitepoint.com/forums/images/email.png" alt="contact us" /><span>contact us</span></a> 
  <a class="dock-item" href="your link here"><img src="http://www.sitepoint.com/forums/images/portfolio.png" alt="usercp" /><span>usercp</span></a> 
  <a class="dock-item" href="your link here"><img src="http://www.sitepoint.com/forums/images/fb.png" alt="facebook" /><span>follow as on facebook</span></a> 
  <a class="dock-item" href="your link here"><img src="http://www.sitepoint.com/forums/images/tw.png" alt="twitter" /><span>follow as on twitter</span></a> 
  <a class="dock-item" href="your link here"><img src="http://www.sitepoint.com/forums/images/history.png" alt="time" /><span>time</span></a> 
  <a class="dock-item" href="your link here"><img src="http://www.sitepoint.com/forums/images/calendar.png" alt="calendar" /><span>calendar</span></a> 
  <a class="dock-item" href="your link here"><img src="http://www.sitepoint.com/forums/images/rss.png" alt="rss" /><span>RSS</span></a> 
</div>
</div>
<script type="text/javascript">
    
    $(document).ready(
        function()
        {
            $('#dock').Fisheye(
                {
                    maxWidth: 50,
                    items: 'a',
                    itemsText: 'span',
                    container: '.dock-container',
                    itemWidth: 40,
                    proximity: 90,
                    halign : 'center'
                }
            )
        }
    );

</script>
</body>
</html>
You can see on my site at Forums that the code is there via view source but for some reason its not showing correctly

A friend got this to work on my site BUT the jquery.js and bar.js is on his host

I really want to put this on my host but its not working

ANY help would be great

Many thanks in advance

To add to this thread, My full NAVBAR template is :

Code:
<div id="navbar" class="navbar">

	<ul id="navtabs" class="navtabs floatcontainer<vb:if condition="$show['member'] AND $notifications_total"> notify</vb:if>">
		
		<vb:if condition="!$vboptions['selectednavtab'] AND THIS_SCRIPT != 'search'">
			<li>

<a class="navtab" href="http://www.nextgenerationgamers.co.uk"/><img src="images/homey.png" style="margin-left:-10px;margin-right:-9px;"/></a></a></li>

<li><a class="navtab" href="{vb:raw vboptions.forumhome}.php{vb:raw session.sessionurl_q}">
<img src="images/forum.png" style="margin-left:-16px;margin-right:-16px;"/></a></li>

<li><a class="navtab" href="http://www.nextgenerationgamers.co.uk/forums/media.php?">
<img src="images/nggtv.png" style="margin-left:-16px;margin-right:-16px;"/></a></li>

<li><a class="navtab" href="http://www.nextgenerationgamers.co.uk/forums/clanwars.php">
<img src="images/upcom.png"  style="margin-left:-14px;margin-right:-14px;"/></a></li>

<li><a class="navtab" href="http://www.nextgenerationgamers.co.uk/forums/clanmembers.php">
<img src="images/roster.png" style="margin-left:-17px;margin-right:-17px;"/></a></li>

<li><a class="navtab" href="http://www.nextgenerationgamers.co.uk/forums/gxboxlive.php">
<img src="images/live.png" style="margin-left:-10px;margin-right:-10px;"/></a></li>

<li><a class="navtab" href="http://www.nextgenerationgamers.co.uk/forums/vbhsignature_maker.php">
<img src="images/sig.png" style="margin-left:-10px;margin-right:-10px;"/></a></li>

<li><a class="navtab" href="http://www.nextgenerationgamers.co.uk/forums/photoshop.php">
<img src="images/photo.png" style="margin-left:-10px;margin-right:-10px;"/></a></li>
				<ul class="floatcontainer">
					{vb:raw template_hook.navbar_start}
					<vb:if condition="$show['searchbuttons']">
						<vb:if condition="$show['member']">
						<li><a href="search.php?{vb:raw session.sessionurl}do=getnew&amp;contenttype=vBForum_Post">{vb:rawphrase new_posts_nav}</a></li>
						<vb:else />
						<li><a href="search.php?{vb:raw session.sessionurl}do=getdaily&amp;contenttype=vBForum_Post">{vb:rawphrase todays_posts}</a></li>
						</vb:if>
					</vb:if>
					{vb:raw template_hook.navbar_after_getnew}
					<vb:if condition="$show['pmmainlink']">
						<li><a href="private.php{vb:raw session.sessionurl_q}" rel="nofollow">{vb:rawphrase private_messages}</a></li>
					</vb:if>
					{vb:raw template_hook.navbar_after_pm}
					<li><a rel="help" href="faq.php{vb:raw session.sessionurl_q}" accesskey="5">{vb:rawphrase faq}</a></li>
					{vb:raw template_hook.navbar_after_faq}
					<li><a href="calendar.php{vb:raw session.sessionurl_q}">{vb:rawphrase calendar}</a></li>
					{vb:raw template_hook.navbar_after_calendar}

					<vb:if condition="$show['communitylink']">
					<li class="popupmenu">
						<a href="javascript://" class="popupctrl" accesskey="6">{vb:rawphrase community}</a>
						<ul class="popupbody popuphover">
							{vb:raw template_hook.navbar_community_menu_start}
							<vb:if condition="$show['quick_links_groups']">
								<li><a href="group.php{vb:raw session.sessionurl_q}">{vb:rawphrase social_groups}</a></li>
							</vb:if>
							<vb:if condition="$show['quick_links_albums']">
								<li><a href="album.php{vb:raw session.sessionurl_q}">{vb:rawphrase pictures_and_albums}</a></li>
							</vb:if>
							<vb:if condition="$bbuserinfo['userid']">
								<li><a href="profile.php?{vb:raw session.sessionurl}do=buddylist"><vb:if condition="$show['friends_and_contacts']">{vb:rawphrase contacts_and_friends}<vb:else />{vb:rawphrase contacts}</vb:if></a></li>
							</vb:if>
							<vb:if condition="$show['memberslist']">
								<li><a href="memberlist.php{vb:raw session.sessionurl_q}">{vb:rawphrase members_list}</a></li>
							</vb:if>
							{vb:raw template_hook.navbar_community_menu_end}
						</ul>
					</li>
					</vb:if>
					{vb:raw template_hook.navbar_after_community}
					<li class="popupmenu">
						<a href="javascript://" class="popupctrl">{vb:rawphrase forum_actions}</a>
						<ul class="popupbody popuphover">
							<li>
								<a href="forumdisplay.php?{vb:raw session.sessionurl}do=markread&amp;markreadhash={vb:raw bbuserinfo.securitytoken}">{vb:rawphrase mark_forums_read}</a>
							</li>
                                                        <vb:if condition="$show['member']">
							<li>
								<a href="profile.php?{vb:raw session.sessionurl}do=editoptions">{vb:rawphrase edit_options}</a>
							</li>
							<li>
								<a href="profile.php?{vb:raw session.sessionurl}do=editprofile">{vb:rawphrase edit_your_details}</a>
							</li>
							</vb:if>
						</ul>
					</li>
					<li class="popupmenu">
						<a href="javascript://" class="popupctrl" accesskey="3">{vb:rawphrase quick_links}</a>
						<ul class="popupbody popuphover">
							<vb:if condition="$show['member']">
								<li><a href="subscription.php{vb:raw session.sessionurl_q}" rel="nofollow">{vb:rawphrase subscribed_threads}</a></li>
								<li><a href="javascript://" onclick="window.open(getBaseUrl() + 'misc.php?{vb:raw session.sessionurl}do=buddylist&amp;focus=1','buddylist','statusbar=no,menubar=no,toolbar=no,scrollbars=yes,resizable=yes,width=250,height=300'); return false;">{vb:rawphrase open_contacts}</a></li>
							</vb:if>
							<vb:if condition="$vboptions['forumleaders']">
							<li><a href="showgroups.php{vb:raw session.sessionurl_q}" rel="nofollow">
		<vb:if condition="$vb_suite_installed">
			{vb:rawphrase view_site_leaders}
		<vb:else />
			{vb:rawphrase view_forum_leaders}
		</vb:if>
	</a></li>
							</vb:if>
							{vb:raw template_hook.navbar_quick_links_menu_pos1}
							{vb:raw template_hook.navbar_quick_links_menu_pos2}
							{vb:raw template_hook.navbar_quick_links_menu_pos3}
							<vb:if condition="$show['wollink']">
								<li><a href="online.php{vb:raw session.sessionurl_q}">{vb:rawphrase whos_online}</a></li>
							</vb:if>
							{vb:raw template_hook.navbar_quick_links_menu_pos4}
						</ul>
					</li>
					{vb:raw template_hook.navbar_end}
				</ul>

			</li>
		<vb:else />
			
		</vb:if>
		{vb:raw template_hook.navtab_middle}
<vb:if condition="!$vboptions['selectednavtab'] AND THIS_SCRIPT == 'search'">
<vb:if condition="$show['member']">
<li class="selected"><a class="navtab" href="search.php?{vb:raw session.sessionurl}do=getnew&amp;contenttype=vBFor um_Post" accesskey="2">{vb:rawphrase getnew_tab}</a>
<ul class="floatcontainer">
<li><a href="search.php?{vb:raw session.sessionurl}do=getnew&amp;contenttype=vBFor um_Post">{vb:rawphrase new_posts_nav}</a></li>
<li><a href="search.php?{vb:raw session.sessionurl}do=getnew&amp;contenttype=vBFor um_SocialGroupMessage">{vb:rawphrase new_group_messages_nav}</a></li>
<li><a href="search.php?{vb:raw session.sessionurl}do=getnew&amp;contenttype=vBFor um_Event">{vb:rawphrase new_events_nav}</a></li>
{vb:raw template_hook.navbar_getnew_menu}
<li><a href="forumdisplay.php?{vb:raw session.sessionurl}do=markread">{vb:rawphrase mark_forums_read}</a></li>
</ul>
</li>
<vb:else />
<li class="selected"><a class="navtab" href="search.php?{vb:raw session.sessionurl}do=getdaily&amp;contenttype=vBF orum_Post" accesskey="2">{vb:rawphrase getnew_tab}</a>
<ul class="floatcontainer">
<li><a href="search.php?{vb:raw session.sessionurl}do=getdaily&amp;contenttype=vBF orum_Post">{vb:rawphrase todays_posts}</a></li>
<li><a href="search.php?{vb:raw session.sessionurl}do=getdaily&amp;contenttype=vBF orum_SocialGroupMessage">{vb:rawphrase daily_group_message}</a></li>
<li><a href="search.php?{vb:raw session.sessionurl}do=getdaily&amp;contenttype=vBF orum_Event">{vb:rawphrase daily_events}</a></li>
{vb:raw template_hook.navbar_getdaily_menu}
<li><a href="forumdisplay.php?{vb:raw session.sessionurl}do=markread">{vb:rawphrase mark_forums_read}</a></li>
</ul>
</li>
</vb:if>
<vb:elseif condition="$show['member']" />
<li><a class="navtab" href="search.php?{vb:raw session.sessionurl}do=getnew&amp;contenttype=vBFor um_Post" accesskey="2">{vb:rawphrase getnew_tab}</a></li>
<vb:else />
<li><a class="navtab" href="search.php?{vb:raw session.sessionurl}do=getdaily&amp;contenttype=vBF orum_Post" accesskey="2">{vb:rawphrase getnew_tab}</a></li>
</vb:if>
		{vb:raw template_hook.navtab_end}
	</ul>

	<vb:if condition="$vboptions['enablesearches']">
	<div id="globalsearch" class="globalsearch">
		<form action="search.php?{vb:raw session.sessionurl}do=process" method="post" id="navbar_search" class="navbar_search">
			<vb:comment><input type="hidden" name="s" value="{vb:raw session.sessionurl}" /></vb:comment>
			<input type="hidden" name="securitytoken" value="{vb:raw bbuserinfo.securitytoken}" />
			<input type="hidden" name="do" value="process" />
			<span class="textboxcontainer"><span><input type="text" value="" name="query" class="textbox" tabindex="99"/></span></span>
			<span class="buttoncontainer"><span><input type="image" class="searchbutton" src="{vb:stylevar imgdir_button}/search.<vb:if condition="(is_browser('ie') AND !is_browser('ie', 7) AND !is_browser('ie', 8))">gif<vb:else />png</vb:if>" name="submit" onclick="document.getElementById('navbar_search').submit;" tabindex="100"/></span></span>
		</form>
		<ul class="navbar_advanced_search">
			<li><a href="search.php{vb:raw session.sessionurl_q}" accesskey="4">{vb:rawphrase advanced_search}</a></li>
		</ul>
	</div>
	</vb:if>
</div>
</div><!-- closing div for above_body -->

<!--- rocketDock Menu developed and Translated to Arabic By Twi[L]ighT Dz , www.shba7.cc/vb  -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>CSS Mac Dock</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/bar.js"></script>

<!--[if lt IE 7]>
 <style type="text/css">
 div, img { behavior: url(iepngfix.htc) }
 </style>
<![endif]-->

<link href="css/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="dock" id="dock">
  <div class="dock-container">
  <a class="dock-item" href="your link here"><img src="images/home.png" alt="home" /><span>home</span></a> 
  <a class="dock-item" href="your link here"><img src="images/email.png" alt="contact us" /><span>contact us</span></a> 
  <a class="dock-item" href="your link here"><img src="images/portfolio.png" alt="usercp" /><span>usercp</span></a> 
  <a class="dock-item" href="your link here"><img src="images/fb.png" alt="facebook" /><span>follow as on facebook</span></a> 
  <a class="dock-item" href="your link here"><img src="images/tw.png" alt="twitter" /><span>follow as on twitter</span></a> 
  <a class="dock-item" href="your link here"><img src="images/history.png" alt="time" /><span>time</span></a> 
  <a class="dock-item" href="your link here"><img src="images/calendar.png" alt="calendar" /><span>calendar</span></a> 
  <a class="dock-item" href="your link here"><img src="images/rss.png" alt="rss" /><span>RSS</span></a> 
</div>
</div>
<script type="text/javascript">
    
    $(document).ready(
        function()
        {
            $('#dock').Fisheye(
                {
                    maxWidth: 50,
                    items: 'a',
                    itemsText: 'span',
                    container: '.dock-container',
                    itemWidth: 40,
                    proximity: 90,
                    halign : 'center'
                }
            )
        }
    );

</script>
</body>
</html>

<div class="body_wrapper">
<div id="breadcrumb" class="breadcrumb">
	<ul class="floatcontainer">
		<li class="navbithome"><a href="index.php{vb:raw session.sessionurl_q}" accesskey="1"><img src="{vb:stylevar imgdir_misc}/navbit-home.png" alt="{vb:rawphrase home}" /></a></li>

		{vb:raw navbits.breadcrumb}
		{vb:raw navbits.lastelement}
	</ul>
	<hr />
</div>

{vb:raw ad_location.ad_navbar_below}
{vb:raw ad_location.global_below_navbar}

<vb:if condition="$show['notices'] AND THIS_SCRIPT != 'register'">
	<form action="profile.php?do=dismissnotice" method="post" id="notices" class="notices">
		<input type="hidden" name="do" value="dismissnotice" />
		<input type="hidden" name="s" value="{vb:raw session.sessionurl}" />
		<input type="hidden" name="securitytoken" value="{vb:raw bbuserinfo.securitytoken}" />
		<input type="hidden" id="dismiss_notice_hidden" name="dismiss_noticeid" value="" />
		<input type="hidden" name="url" value="{vb:raw return_link}" />
		<ol>
			{vb:raw notices}
		</ol>
	</form>
</vb:if>