MyBB Community Forums

Hello,
I am trying to integrate Coin Slider on MyBB in my localhost.
Uploaded the js files to /jscripts. I've added the stylesheet to global.css, added the slider content in header template, added

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/coin-slider.min.js"></script>

to the headerinclude.

I get this on my test forum:


Here is my header template code

<div id="container">
		<a name="top" id="top"></a>
		<div id="header">
			<div class="headershine"></div>
			<a href="{$mybb->settings['bburl']}/index.php" class="logo"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" /></a>
			<div class="userpanel">{$welcomeblock}</div>
			<ul class="menu">
				<li><a href="{$mybb->settings['bburl']}/index.php">Community</a></li>
				<li><a href="/">Home</a></li>
				<li><a href="{$mybb->settings['bburl']}/search.php">Search</a></li>
				<li><a href="{$mybb->settings['bburl']}/portal.php">Portal</a></li>
				<li><a href="{$mybb->settings['bburl']}/memberlist.php">Members</a></li>
				<li><a href="{$mybb->settings['bburl']}/calendar.php">Calendar</a></li>
				<li><a href="{$mybb->settings['bburl']}/showteam.php">Staff</a></li>
				<li><a href="{$mybb->settings['bburl']}/stats.php">Statistics</a></li>
			</ul>
		</div>
		<navigation>

<div id='coin-slider'>

              <img src='http://localhost/mybb/images/1.jpg' >


	......
	......
		<img src='http://localhost/mybb/images/2.jpg' >

	......
	......

	
		<img src='http://localhost/mybb/images/3.jpg' >

         ......
         ...... 

		<img src='http://localhost/mybb/images/4.jpg' >
		
</div>
<script type="text/javascript">
	$(document).ready(function({ width: 650, height: 290, navigation: true, delay: 5000 }) {
		$('#coin-slider').coinslider();
	});
</script>


		<div id="content">
			{$bannedwarning}
			{$bbclosedwarning}
			{$unreadreports}
			{$pending_joinrequests}
			<br />

Any ideas how to fix it?

Bump, any help is appreciated.