Javascript and html conflict with navigations

I am using this bgstretcher jquery plugin to go with my site [URL=“”]here.

There seems to be a conflict with the bgstretcher.js file whereby my #nav div can’t display the appropriate text because the .js file contains li elements which is being mistaken by the nav ul li html element.

I don’t know much about jquery and only know enough to use them but not fix them. Does anyone have suggestions on how to get around this issue?

The bulk of code that seems to cause the issue is

	$.fn.bgStretcher.pagination = function(){
		var l = $(allLIs).length;
		var output = ''; var i = 0;
		if (l > 0) {
			output += '<ul>';
				for (i = 0; i < l; i++){
					output += '<li><a href="javascript:;">'+(i+1)+'</a></li>';
			output += '</ul>';
				if ($(this).parent().hasClass('showPage')) return false;
				$(allLIs).stop(true, true);
				$.fn.bgStretcher.slideShow($.fn.bgStretcher.settings.sequenceMode, $($.fn.bgStretcher.settings.pagination).find('A').index($(this)));
				return false;
		return false;

Using Firebug, It seems that my code shows up as li class=“showpage”<a href=“javascript”:;">1</a>

rather than li <a href=“#”>Home</a>

It will be the pagination property that’s conflicting with you there. The bgStretcher plugin allows you to specify an element for pagination. On their demo page you see it as the pager.

i’ve tried renaming the div but the issue still persists so not sure what else to do?

Do you want the pagination pager to be automatically created by the plugin in that area? If you don’t want the plugin to automatically create a pagination pager then don’t specify that option in the config.

The test page that you link to still shows that it’s there.

I didn’t. I simply took that option out of the script in the head file but my nav links still wouldn’t show.

actually, nevermind. there was a glitch in the ftp. i was testing it locally but it works now. thanks for your help!