Smooth Navigation Menu

[stellating]

1) Script Title: Smooth Navigation Menu

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...smoothmenu.htm
3) Describe problem:

It works very well when viewing in firefox but not in internet explorer. I have tested in IE tester and it said 'parent().get(...)' is null or not an object. Can you please help me. Thanks and appreciated.
This is the site: http://www.ghotel.com.sg/

[azoomer]

hi, looking at you code it seems that you will need to remove this

<link rel="stylesheet" href="http://www.ghotel.com.sg/" type="text/css" media="screen" />

And for now I cant see any smoothmenu2 on the page, so you could remove or at least outcomment this part until you have have the extra menu in place.

ddsmoothmenu.init({
	mainmenuid: "smoothmenu2", //Menu DIV id
	orientation: 'v', //Horizontal or vertical menu: Set to "h" or "v"
	classname: 'ddsmoothmenu-v', //class added to menu's outer DIV
	//customtheme: ["#804000", "#482400"],
	contentsource: "markup" //"markup" or ["container_id", "path_to_menu_file"]
})

I hope that will take care of the errors.

[stellating]

Hi azoomer, thx for the help! There is no errors showing in the IE tester but i think there is some gap in between my dropdown menu and my body content. Is it shown the same in ur browser? Do you have any idea what happened? Is it because of the alignment?

Anyhow, thanks for the help!

Lots of thanks,
Stella

[azoomer]

I would have to look closer at it later tonight to understand why the gap is there, it is only in internet explorer. In firefox it looks okay.
Right now I see a problem in the stylecode.css
You need to remove the style tags.
<style> in the beginning an</style> in the end has to be removed, it is not used in external stylesheets.

[azoomer]

Hi Stella, I have been looking at your page and the reason it looks so different in Internet Explorer is not because of the menu script, but it is because the html markup on the page has a lot of errors. Here is a part of the markup

<div id="smoothmenu1" class="ddsmoothmenu">
<ul>
<li><a href="testing.html">Home</a></li>
<li><a href="location.html">Location</a>
<li><a href="facilities.html">Facilities</a>
<li><a href="rooms.html">Rooms</a>
<li><a href="gallery.html">Gallery</a>
<li><a href="videos.html">Videos</a>
<li><a href="contact.html">Contact</a>

</li>
<li><a href="#">Singapore</a>
   <ul>
  <li><a href="#">Singapore Changi Airport</a>
    <ul>
    <li><a href="singaporechangiairport.html">About</a>
   <li><a href="city.html">Changi To City</a>
   </ul>

  <li><a href="attractions.html">Attractions</a></li>
  <li><a href="shopping.html">Shopping</a>
  <ul>
  <li><a href="orchard.html">Orchard Road</a>
  <li><a href="bugis.html">Bugis</a>
  </ul>
  <li><a href="#">Restaurants</a>

  <ul>
  <li><a href="foodandbeverages.html">Places to Eat</a>
      <li><a href="indianfood.html">Indian</a>
     <li><a href="malayfood.html">Malay</a>
     <li><a href="chinesefood.html">Chinese</a>
   </ul>
   <li><a href="#">Transport</a>

    <ul>
    <li><a href="bus.html">Bus</a>
  <li><a href="mrt.html">MRT</a>
  </ul>

   
  

		</ul>

</li>
<br style="clear: left" />
</div>

As you can see, most of the list items <li> do not have a closing tag </li> and this is going to give problems. If you compare it to the html on the demo page

<div id="smoothmenu1" class="ddsmoothmenu">
<ul>
<li><a href="http://www.dynamicdrive.com">Item 1</a></li>
<li><a href="#">Folder 0</a>
  <ul>
  <li><a href="#">Sub Item 1.1</a></li>
  <li><a href="#">Sub Item 1.2</a></li>
  <li><a href="#">Sub Item 1.3</a></li>
  <li><a href="#">Sub Item 1.4</a></li>
  <li><a href="#">Sub Item 1.2</a></li>
  <li><a href="#">Sub Item 1.3</a></li>
  <li><a href="#">Sub Item 1.4</a></li>
  </ul>
</li>
<li><a href="#">Folder 1</a>
  <ul>
  <li><a href="#">Sub Item 1.1</a></li>
  <li><a href="#">Sub Item 1.2</a></li>
  <li><a href="#">Sub Item 1.3</a></li>
  <li><a href="#">Sub Item 1.4</a></li>
  <li><a href="#">Sub Item 1.2</a></li>
  <li><a href="#">Sub Item 1.3</a></li>
  <li><a href="#">Sub Item 1.4</a></li>
  </ul>
</li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Folder 2</a>
  <ul>
  <li><a href="#">Sub Item 2.1</a></li>
  <li><a href="#">Folder 2.1</a>
    <ul>
    <li><a href="#">Sub Item 2.1.1</a></li>
    <li><a href="#">Sub Item 2.1.2</a></li>
    <li><a href="#">Folder 3.1.1</a>
		<ul>
    		<li><a href="#">Sub Item 3.1.1.1</a></li>
    		<li><a href="#">Sub Item 3.1.1.2</a></li>
    		<li><a href="#">Sub Item 3.1.1.3</a></li>
    		<li><a href="#">Sub Item 3.1.1.4</a></li>
    		<li><a href="#">Sub Item 3.1.1.5</a></li>
		</ul>
    </li>
    <li><a href="#">Sub Item 2.1.4</a></li>
    </ul>
  </li>
  </ul>
</li>
<li><a href="http://www.dynamicdrive.com/style/">Item 4</a></li>
</ul>
<br style="clear: left" />
</div>

You can see that all the list items are closed.
I tried to fix the markup on your site, but it turns out to be difficult because the layout changes if I correct the errors. The problem is that I'm not entirely sure how you really want it to look. Is it deliberate that the Singapore tab is placed where it is now ?
There are also quite a few other errors on the page that should be corrected. It is peculiar with the large negative margins, I mean it could work, but it seems like a way to try to save a layout that went wrong initially! If you need help fixing the errors I can try to help you, but It is only possible, if you give a very good explanation about how you want the site to look and function.

[stellating]

Hi. i have tried editing and now IE works but not firefox. the menu do not have any errors. It is my alignment/margin i think. I tried my best but can't get rid of the gap in firefox. Can u help me pls?

All i want is the gap to be removed but it seems like it's hard. I wonder if you know what is wrong?

Thx alot!

[azoomer]

Okay, try this then

.banner {
margin-left:120px;
margin-right:60px;
margin-top:0;
position:relative;
width:730px;
z-index:-1;
}

and tell me if that is better

[stellating]

This is absolutely fine! Thx alot! I was thinking if i should use z index but keep doing research about other possibilities. Thx for the help!

Oh ya i have another problem, which is when i click the menu in IE, the banner and right box will blink. Could you help me with this?

Sorry and thank you

[azoomer]

About the blinking. I don't know how to change that, not sure if it is possible. Seems like IE is reloading the images. It could be related to some kind of cache configuration that I am not aware of. Maybe someone else knows this ?

[stellating]

noted. Thx alot anyway!