Link to home
Start Free TrialLog in
Avatar of metropia
metropiaFlag for United States of America

asked on

drop down menu list custom

hello,

i am using a free wordpress theme for the website i am working on.
there are a few customizations, and the them works very well on most browsers.

the theme comes with a css style sheet for when its displayed on a mobilde devide such as an iphone. this is a very nice feature of the theme.

there is only one issue that i have run into that i have not been able to work around using only css.

one of the menu items (music) when displayed on a regular computer screen, runs a javascript window open to display a music player on a new browser window.

the mobile version of the theme, converts the navigation menu to a drop down menu.

my problem is that when selecting the music page from the drop down menu, the page with the music player, does not open, because it does not execute the javascript for that page.

I would like to know if I could get help in adding some code that would make the drop down menu open the music page (player) when the music option gets chosen.

the javascript code that builds the drop down menu list is:

/*! http://tinynav.viljamis.com v1.03 by @viljamis */
(function(a,i,g)
{
	a.fn.tinyNav=function(j)
	{
		var c=a.extend(
		{
			active:"selected",header:!1
		},j);
			return this.each(function()
			{
				g++;
				var h=a(this),
				d="tinynav"+g,
				e=".l_"+d,
				b=a("<select/>").addClass("tinynav "+d);

				if(h.is("ul,ol"))
				{
					c.header&&b.append(a("<option/>").text("Navigation"));
					var f="";h.addClass("l_"+d).find("a").each(function()
					{
						f+='<option value="'+a(this).attr("href")+'">'+a(this).text()+"</option>"
					});
						b.append(f);
						c.header||b.find(":eq("+a(e+" li").index(a(e+" li."+c.active))+")").attr("selected",!0);
						b.change(function()
						{
							i.location.href=a(this).val()
						});
						a(e).after(b)
				}
			})
	}
})
(jQuery,this,0);

Open in new window


the javascript function that opens the music player when the music item is clicked from a regular computer screen is:
<script language="javascript">

function popUp(URL) 
{
	day = new Date();
	id = day.getTime();
	eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=0,location=0,statusbar=1,menubar=0,resizable=0,Left=2,top=91,width=460,height=200');");
}

</script>

Open in new window

from menu item:

<li id="menu-item-75" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-75"><a href="javascript:popUp('/zl-ck-page-player.html')">MUSIC</a></li>

Open in new window



this is the url to the website i am working on: http://catchkidcom.ipage.com

Thank you much for reading this question and for your help.

Best regards.
ASKER CERTIFIED SOLUTION
Avatar of Michel Plungjan
Michel Plungjan
Flag of Denmark image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of metropia

ASKER

Hello Michel,

Thank you for fixing my script. It opens now when visiting the website through a mobile phone. What I noticed is that the page does not open on a new page when accessing it from the drop down menu list on the mobile version.Is there a way to make it work just as it does on a regular computer/ browser?

Thank you and best regards.
What do you mean ? A mobile browser like safari will open a new window which will show the new window on top of the current window
Do you have a page to show? I do not see a drop down on the link you gave
the drop down only shows when the website is viewed on a mobile phone like an iPhone. otherwise it displays a normal navigation menu with links.
I only HAVE iDevices here,
so you do not see the drop down menu right below the logo?
it should display when holding the iPhone vertically.
I see a normal menu. Nothing drops down

When I click on music, I get a new window with /zl-ck-page-player.html that has 4 lines with music files