Выпадающее меню скрыто за слайдером JavaScript

Question

В настоящее время раскрывающаяся часть моего меню навигации скрыта за ползунком javascript, который находится непосредственно под ним.Смотрите проблему здесь .Как сделать так, чтобы раскрывающееся меню отображалось поверх ползунка?

Вот некоторые из CSS для двух div, которые содержат соответствующее навигационное меню и ползунок.

#nav {
width:1024px;
height:20px;
border-bottom:1px solid #ccc;
}

Слайдер:

#slider {
width:1024px;
height:300px;
background: #353A33;
padding-bottom:5px;
}

Есть идеи?

Answer 1

Попробуйте добавить z-index к вашему .dropdown классу:

 /* Navigation Style */
.dropdown {
  position:relative;
  font-family: arial, sans-serif;
  height:50px;
  width:100%;
  font-size:14px;
  color:#ffffff;
  background:#353A33;
  z-index:1000;
} 

Answer 2

использование позиция: абсолютная с самым высоким z-индексом в вашей навигации