Problem with the style of list
Here is the page: http://armagan2014.blogspot.com/p/blog-page_14.html where I try to run this lesson: http://webdesign.tutsplus.com/tutori...webdesign-5944
This is the code that I use. I guess the problem is the global style that interferes with local style.
Code:
<link rel="stylesheet" href="http://4433.hit.bg/AR/EN/styles.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<div id="wrapper">
<ul class="menu">
<li class="item1"><a href="#">Български<span>резюме</span></a>
<ul>
<li class="subitem1"><a href="#">Текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст </a></li>
<li class="subitem2"><a href="#">Strange “Stuff”</a></li>
<li class="subitem3"><a href="#">Automatic Fails</a></li>
</ul>
</li>
<li class="item2"><a href="#">English<span>summary</span></a>
<ul>
<li class="subitem1"><a href="#">Cute Kittens</a></li>
<li class="subitem2"><a href="#">Strange “Stuff”</a></li>
<li class="subitem3"><a href="#">Automatic Fails</a></li>
</ul>
</li>
</ul>
</div>
<!--initiate accordion-->
<script type="text/javascript">
$(function() {
var menu_ul = $('.menu > li > ul'),
menu_a = $('.menu > li > a');
menu_ul.hide();
menu_a.click(function(e) {
e.preventDefault();
if(!$(this).hasClass('active')) {
menu_a.removeClass('active');
menu_ul.filter(':visible').slideUp('normal');
$(this).addClass('active').next().stop(true,true).slideDown('normal');
} else {
$(this).removeClass('active');
$(this).next().stop(true,true).slideUp('normal');
}
});
});
</script>
