Member Avatar for LogicWeb

Working on a web site and noticed that of about 70 pages total, only one page (regarding Roundcube webmail) has an issue with the sub-menu not working at all.

This is the header

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<head>
	<title>Brand Media. Premium HTML Template</title>
	<link rel="stylesheet" type="text/css" media="screen" href="../../code/css/styles.css" />
	<!--[if lt IE 9]><script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script><![endif]-->
	<!--[if IE 7]>
		<link rel="stylesheet" type="text/css" media="screen" href="../../code/css/ie.css" />
	<![endif]-->
	<!-- jQuery Script -->
	<script type="text/javascript" src="../../code/js/jquery-1.4.2.min.js"></script>
	<!-- Cufon Script -->
	<script type="text/javascript" src="../../code/js/cufon-yui.js"></script>
	<script type="text/javascript" src="../../code/js/nevis_700.font.js"></script>
	<script type="text/javascript" src="../../code/js/cufon.js"></script>
	<script type="text/javascript" src="../../code/js/OfficinaSerITCStd_Medium_italic_750.font.js"></script>
	<script type="text/javascript">
		Cufon.replace('#tagline');
	</script>
	<!-- Dropdown Menu -->
	<script type="text/javascript" src="../../code/js/hoverIntent.js"></script>
	<script type="text/javascript" src="../../code/js/superfish.js"></script>
	<script type="text/javascript">
		$(document).ready(function() {
			$("#header ul li ul li:odd").css("background-color", "#37393d");	
			$('#header ul').superfish({
				delay: 400
			});
		});
	</script>
	<!-- Portfolio Script -->
	<script type="text/javascript">
		$(document).ready(function() {
				$("#folioCats a").click(function() {
					var cat = $(this).attr('class');
					$(".projects li").hide();
					$(".projects li").filter('.'+cat).fadeIn();
					$("#folioCats a").parent().removeClass('active');
					$("#folioCats a").parent().css('background-image', 'none');
					$(this).parent().addClass('active');
					$(this).parent().css('background-image', 'url("presentation/images/cats_hover.jpg")');
					return false;
				});
				$("#folioCats a.all").click(function() {
					$(".projects li").fadeIn();
				});
		});
	</script>
	<!-- Slider Script -->
	<script type="text/javascript" src="../../code/js/jquery.cycle.all.min.js"></script>
	<script type="text/javascript">
		$(document).ready(function() {
			$('#roundcubeslider ul').cycle({
				fx: 'fade',
				pager:'#roundcubeslider-nav',
				pause: 1,
			});	
		});
	</script>
	</head>

Screenshot:
http://pingy.us/?v=rc.png

What happens is the sub-menu (the one with "Control Panel" bg in reed) has those links that just do not work at all. The slider with the roundcube images work just fine otherwise and everything else works fine, including main navigation menu.

I removed this line from header:

<!-- jQuery Script -->
	<script type="text/javascript" src="../../code/js/jquery-1.4.2.min.js"></script>

Slider stopped working, but sub-menu started working.

I even tried various locations/priority order for the scripts as well, same problem.

Your help appreciated.

  • 3 Contributors
  • 4 Replies
  • 170 Views
  • 17 Hours Discussion Span
  • Latest Post Latest Post by LogicWeb
Member Avatar for Taywin

The problem is that it is very difficult to pinpoint the problem with what you are showing. There are so many JS files involved. There could be other side effect that may not be in the file you are mentioning... That's why I usually create JS files my own, not use others... It is very difficult to find the faulty part and hack it. :(

Member Avatar for LogicWeb

That's what I figured. Hopefully someone else who might be a geek in JS might have some insight :)

Appreciate your response and assistance my friend, thank you.

Member Avatar for @developer

LogicWeb I'm not sure but if you are using any other js frame work, conflict may occur..Try declaring this at top of your script

<script>
 var $j = jQuery.noConflict();
</script>

and..
Now use $j instead of jQuery in your code like $j("#id").click();
Not sure whether that works,but anyway give a try..

Edited by @developer because: n/a
Member Avatar for LogicWeb

Thanks, but unfortunately that did not work.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.