Problem in IE with Accordion Menu

**volkodav** · 04-22-2009, 09:30 AM

1) Script Title: accordeon menu

2) Script URL (on DD): http://dynamicdrive.com/dynamicindex...enu-bullet.htm

3) Describe problem: in firefox its work fine, but in internet explorer its doesnot work. Where is a problem? Help me please.
If you want I can send the script of my home page (main.tpl)

**Snookerman** · 04-22-2009, 09:35 AM

Please post a link to the page on your site that contains the problematic script or attach your code so we can check it out and help you.

**volkodav** · 04-22-2009, 09:41 AM

Here is My Site (in russian)

**volkodav** · 04-22-2009, 12:55 PM

somebody ?

**volkodav** · 04-22-2009, 03:02 PM

PART 1

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

<head>
<meta name="verify-v1" content="5OBJ9ief6mXjL51WZBylec5Ps9hnpa14M7W/qlJLYZ8=" />
<meta name='yandex-verification' content='7b652ea7e7a81a25' />  
{headers}

<link href="{THEME}/css/style.css" type="text/css" rel="stylesheet" />
<link href="{THEME}/css/engine.css" type="text/css" rel="stylesheet" />

<!--[if IE]>
<link href="{THEME}/css/ie.css" type="text/css" rel="stylesheet" />
<![endif]-->

<script language="javascript" type="text/javascript" src="/templates/Lightstyle2/js/animatedcollapse.js"></script> 

<!-- FrosT.Infernal.Customs.Interface jQuery for Google --!>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">google.load("jquery", "1.3.2");</script>

<!-- FrosT.Infernal.Customs.Interface To Top Scrool --!>
<script type="text/javascript" src="{THEME}/js/FrosT.Infernal.Customs.Interface/jQuery.Scroll.Plugin.js"></script>

<script language="javascript" type="text/javascript" src="/templates/Lightstyle2/js/volk.js"></script> 

 <style>
    #hintbox{ /*CSS for pop up hint box */
      position:absolute;
      top: 0;
      background-color: white;
      width: 170px; /*Default width of hint.*/
      padding: 3px;
      border:1px solid #778899;
      font:normal 11px Verdana;
      line-height:18px;
      z-index:100;
      visibility: hidden;
    }

   .hintanchor{
     padding-left: 8px;
   }
 </style>
 <script language="JavaScript" src="http://web-prostor.net/engine/skins/default.js"></script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<script type="text/javascript" src="/templates/Lightstyle2/js/ddaccordion.js">

/***********************************************
* Accordion Content script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
* This notice must stay intact for legal use
***********************************************/

</script>


<script type="text/javascript">


ddaccordion.init({ //top level headers initialization
	headerclass: "expandable", //Shared CSS class name of headers group that are expandable
	contentclass: "categoryitems", //Shared CSS class name of contents group
	revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click", "clickgo", or "mouseover"
	mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
	collapseprev: true, //Collapse previous content (so only one open at any time)? true/false 
	defaultexpanded: [0], //index of content(s) open by default [index1, index2, etc]. [] denotes no content
	onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
	animatedefault: false, //Should contents open by default be animated into view?
	persiststate: true, //persist state of opened contents within browser session?
	toggleclass: ["", "openheader"], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
	togglehtml: ["prefix", "", ""], //Additional HTML added to the header when it's collapsed and expanded, respectively  ["position", "html1", "html2"] (see docs)
	animatespeed: "fast", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
	oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
		//do nothing
	},
	onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
		//do nothing
	}
})

ddaccordion.init({ //2nd level headers initialization
	headerclass: "subexpandable", //Shared CSS class name of sub headers group that are expandable
	contentclass: "subcategoryitems", //Shared CSS class name of sub contents group
	revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click" or "mouseover
	mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
	collapseprev: true, //Collapse previous content (so only one open at any time)? true/false 
	defaultexpanded: [], //index of content(s) open by default [index1, index2, etc]. [] denotes no content
	onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
	animatedefault: false, //Should contents open by default be animated into view?
	persiststate: true, //persist state of opened contents within browser session?
	toggleclass: ["opensubheader", "closedsubheader"], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
	togglehtml: ["none", "", ""], //Additional HTML added to the header when it's collapsed and expanded, respectively  ["position", "html1", "html2"] (see docs)
	animatespeed: "fast", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
	oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
		//do nothing
	},
	onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
		//do nothing
	}
})


</script>

<style type="text/css">

.arrowlistmenu{
width: 225px; /*width of accordion menu*/
}

.arrowlistmenu .menuheader{ /*CSS class for menu headers in general (expanding or not!)*/
font: bold 13px Trebuchet MS;
color: white;
background: black url(/pic/titlebar.png) repeat-x center left;
margin-bottom: 10px; /*bottom spacing between header and rest of content*/
text-transform: uppercase;
padding: 4px 0 4px 10px; /*header text is indented 10px*/
cursor: hand;
cursor: pointer;
}

.arrowlistmenu .openheader{ /*CSS class to apply to expandable header when it's expanded*/
background-image: url(/pic/titlebar-active.png);

}

.arrowlistmenu ul{ /*CSS for UL of each sub menu*/
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 8px; /*bottom spacing between each UL and rest of content*/
}

.arrowlistmenu ul li{
padding-bottom: 2px; /*bottom spacing between menu items*/
}

.arrowlistmenu ul li .opensubheader{ /*Open state CSS for sub menu header*/
background: lightblue !important;
}

.arrowlistmenu ul li .closedsubheader{ /*Closed state CSS for sub menu header*/
background: lightgreen !important;
}

.arrowlistmenu ul li a{
color: #A70303;
background: url(/pic/arrowbullet.png) no-repeat center left; /*custom bullet list image*/
display: block;
padding: 2px 0;
padding-left: 19px; /*link text is indented 19px*/
text-decoration: none;
font-weight: bold;
border-bottom: 1px solid #dadada;
font-size: 90%;
}

.arrowlistmenu ul li a:visited{
color: #A70303;
}

.arrowlistmenu ul li a:hover{ /*hover state CSS*/
background-color: #F3F3F3;
}

.arrowlistmenu ul li a.subexpandable:hover{ /*hover state CSS for sub menu header*/
background: lightblue;
}
</style>

</head>
<body>
{AJAX}
<!-- Ктегории Начало -->
<div id="nav">
	<ul>

	<li>&nbsp;&nbsp;&nbsp;</li>

	<li><a class="tip" onmouseover="tooltip('Программное обеспечение для вашего компьютера');" onmouseout="exit();" href="/soft"><font size=3><b>Софт</b></font></a></li>

	<li><a class="tip" onmouseover="tooltip('Самые горячие новинки в мире кино абсолютно бесплатно');" onmouseout="exit();" href="/movies"><font size=3><b>Фильмы</b></font></a></li>

    <li><a class="tip" onmouseover="tooltip('Для оптимизации и проверки данных Вашего сайта');" onmouseout="exit();" href="http://web-prostor.net/seotools"><b><font size=3>SEO Инструменты</font></b></a></li>

                       <li><a class="tip" onmouseover="tooltip('Кликните здесь, чтобы играть в игры. Обратите внимание, онлайн игры на главной странице НЕ публикуются! Почаще проверяйте данную категорию и следите за новинками! Играйте в онлайн игры вместе с нами!');" onmouseout="exit();" href="http://web-prostor.net/online_games/"><font size=3><b>Flash Игры</b></font><volk>&nbsp;&nbsp;[new!]</volk></a></li>

    <li><a class="tip" onmouseover="tooltip('Операционные системы на любой вкус абсолютно бесплатно');" onmouseout="exit();" href="/win"><font size=3><b>OS Windows</b></font></a></li>

    <li><a class="tip" onmouseover="tooltip('Не хотите скачивать фильмы? Это долго? Ну тогда смотрите Ваши любимые фильмы в режиме Онлайн');" onmouseout="exit();" href="/on-line"><font size=3><b>Онлайн Фильмы</b></font></a></li>
	</ul>
  </div>


<!-- Кaтегории Конец -->



<div id="intro">
	<ul>
	<li ><a class="tip" onmouseover="tooltip('Вернуться на главную страницу сайта');" onmouseout="exit();" href="/">Главная</a></li>
	<li ><a class="tip" onmouseover="tooltip('Для регистрации на нашем сайте нажмите эту кнопку');" onmouseout="exit();" href="/index.php?do=register">Регистрация</a></li>
	<li ><a class="tip" onmouseover="tooltip('Обратная связь с пользователями и администрацией сайта');" onmouseout="exit();" href="/index.php?do=feedback">Feedback</a></li>
        <li ><a class="tip" onmouseover="tooltip('Правила нашего сайта. Читать всем!');" onmouseout="exit();" href="http://web-prostor.net/wpn_static/rules_wpn.html">Правила</a></li>
	<li ><a class="tip" onmouseover="tooltip('Рассылка новостей');" onmouseout="exit();" href="/rss.xml">RSS 2.0</a></li>
	<li ><a class="tip" onmouseover="tooltip('Здесь Вы сможете проверить скорость вашего интернет соединения');" onmouseout="exit();" href="/?do=speedtest">SpeedTest</a></li>
	</ul>
</div>

**volkodav** · 04-22-2009, 03:03 PM

PART 2

Code:

<div id="header">
	<div id="header-right"></div>
	<div id="logo">
		<a href="/"><img src="{THEME}/images/logo1.jpg" /></a>
	</div>
</div>

<br>

<div id="outer" style="clear:both;">
	<div id="main">
		<div id="wrapper" class="column">
			<div id="content">
				<div id="content-top">
					<div id="content-left"></div>
					<div id="content-right"></div>
				</div>
				<div id="padding">
					
					<span id='dle-info'></span>

<!-- здесь можно вставить рекламный блок над выводом контента  -->

					<div id='dle-content'>{info}{content}</div>
				</div>
			<div id="content-bottom">
				<div id="bottom-left"></div>
				<div id="bottom-right"></div>
			</div>

			</div>
		</div>


		<div id="right" class="column">

			<!-- Блок МЕНЮ Начало -->
			<div class="block-top">
				<div class="block-left"></div>
				<div class="block-right"></div>
			</div>

			<div class="block">
				<center><h1>Разделы сайта</h1></center>
		<div class="arrowlistmenu">

<h3 class="menuheader expandable">Софт | Soft</h3>
<ul class="categoryitems">
<li><a href="http://web-prostor.net/soft/">Софт</a></li>
<li><a href="http://web-prostor.net/soft/portable/">Portable</a></li>
<li><a href="http://web-prostor.net/soft/music_soft/">Для музыканта</a></li>
<li><a href="http://web-prostor.net/soft/multi/">Мультимедиа</a></li>
<li><a href="http://web-prostor.net/apteka/" >Аптека (ключи)</a></li>
<li><a href="http://web-prostor.net/unix/">Мир Unix</a></li>
</ul>


<h3 class="menuheader expandable">OS Windows + BSD</h3>
<ul class="categoryitems">
<li><a href="http://web-prostor.net/win/win7/">Windows 7</a></li>
<li><a href="http://web-prostor.net/win/vista/">Windows Vista</a></li>
<li><a href="http://web-prostor.net/win/xp/">Windows XP</a></li>
<li><a href="http://web-prostor.net/win/livecd/">Live CD</a></li>
<li><a href="http://web-prostor.net/win/linux/">Linux | Unix</a></li>
<li><a href="http://web-prostor.net/win/google/">Google</a></li>
<li><a href="http://web-prostor.net/win/freebsd/">Free BSD</a></li>
<li><a href="http://web-prostor.net/win/other/">Other</a></li>
</ul>


<h3 class="menuheader expandable">Кинотеатр и видео</h3>
<ul class="categoryitems">
<li><a href="http://web-prostor.net/movies/" class="subexpandable">Все жанры фильмов:</a>
		<ul class="subcategoryitems" style="margin-left: 8px">
	<li><a href="http://web-prostor.net/movies/">Фильмы (общее)</a></li>
	<li><a href="http://web-prostor.net/movies/comedii/">Комедии</a></li>
	<li><a href="http://web-prostor.net/movies/ujasi/">Ужасы</a></li>
	<li><a href="http://web-prostor.net/movies/prikluchenia/">Приключения</a></li>
	<li><a href="http://web-prostor.net/movies/boeviki/">Боевики</a></li>
	<li><a href="http://web-prostor.net/movies/fantasy/">Фантастика / Фэнтези</a></li>
	<li><a href="http://web-prostor.net/movies/detektivi/">Детективы</a></li>
	<li><a href="http://web-prostor.net/movies/erotika/">Эротика</a></li>
	<li><a href="http://web-prostor.net/movies/multiki/">Мультфильмы</a></li>
	<li><a href="http://web-prostor.net/movies/rodina/">Отечественные</a></li>
	<li><a href="http://web-prostor.net/movies/trilleri/">Триллеры</a></li>
	<li><a href="http://web-prostor.net/movies/war/">Военные</a></li>
	<li><a href="http://web-prostor.net/movies/drama/">Драмы / Мелодрамы</a></li>
	<li><a href="http://web-prostor.net/movies/history/">Исторические</a></li>
	<li><a href="http://web-prostor.net/movies/kriminal/">Криминальные</a></li>
	<li><a href="http://web-prostor.net/movies/dvd/">DVD / Blu-Ray / HDTV</a></li>
	<li><a href="http://web-prostor.net/movies/videoclips/">Видеоклипы и концерты</a></li>
	<li><a href="http://web-prostor.net/movies/docum/">Документальные фильмы</a></li>
	<li><a href="http://web-prostor.net/movies/serial/">Сериалы</a></li>
	<li><a href="http://web-prostor.net/movies/trailer/">Трейлеры</a></li>
		</ul>
</li>

<li><a href="http://web-prostor.net/on-line/">Онлайн фильмы</a></li>
<li><a href="http://web-prostor.net/viduroki/">Видео уроки</a></li>
<li><a href="http://web-prostor.net/flash_mult/" >Flash мультики</a></li>
</ul>


<h3 class="menuheader expandable">Музыка и игры</h3>
<ul class="categoryitems">
<li><a href="http://web-prostor.net/music/" >Музыка (мр3)</a></li>
<li><a href="http://web-prostor.net/games/" class="subexpandable" >Игры:</a>
		<ul class="subcategoryitems" style="margin-left: 10px">
	<li><a href="http://web-prostor.net/games/" >Игры (общее)</a>
	<li><a href="http://web-prostor.net/games/pc-games/" >Игры для РС</a></li>
	<li><a href="http://web-prostor.net/games/xbox/" >Xbox 360, PS2, PS3 и PSP</a></li>
		</ul>
</li>

<li><a href="http://web-prostor.net/online_games/" >ОНЛАЙН | FLASH игры</a></li>
<li><a href="http://web-prostor.net/mobila/" >Мобила (игры,мелодии)</a></li>
<li><a href="http://web-prostor.net/umor/" >Юмор</a></li>
</ul>


<h3 class="menuheader expandable">Литература</h3>
<ul class="categoryitems">
<li><a href="http://web-prostor.net/literatura/learning/" >Учебные материалы</a></li>
<li><a href="http://web-prostor.net/literatura/jurnali/" >Журналы</a></li>
<li><a href="http://web-prostor.net/literatura/sam/" >Самоучители</a></li>
<li><a href="http://web-prostor.net/literatura/manuals/" >Manuals/Tutorials</a></li>
<li><a href="http://web-prostor.net/literatura/books/" >Книги</a></li>
<li><a href="http://web-prostor.net/literatura/books/audiobook/" >Аудиокниги</a></li>
<li><a href="http://web-prostor.net/anons/" >Статьи/Анонсы</a></li>
<li><a href="http://web-prostor.net/literatura/">Литература (общее)</a></li>
<li><a href="http://web-prostor.net/anons/novosti/" >Новости в мире</a></li>
<li><a href="http://web-prostor.net/anons/jelezo/" >Новости железа</a></li>
<li><a href="http://web-prostor.net/sql_urok/" >Уроки SQL</a></li>
<li><a href="http://web-prostor.net/html_urok/" >Уроки HTML</a></li>
</ul>


<h3 class="menuheader expandable">Графика и дизайн</h3>
<ul class="categoryitems">
<li><a href="http://web-prostor.net/graf/" >Графика</a></li>
<li><a href="http://web-prostor.net/graf/theme/" >Оформление для Windows</a></li>
<li><a href="http://web-prostor.net/graf/fotoshop/" >Фотошоп +</a></li>
<li><a href="http://web-prostor.net/graf/diz/" >Дизайнеру</a></li>
<li><a href="http://web-prostor.net/wall/" >Обои</a></li>
<li><a href="http://web-prostor.net/wall/fotoz/" >Фотографии</a></li>
<li><a href="http://web-prostor.net/wall/kartini/" >Картины</a></li>
<li><a href="http://web-prostor.net/icons/" >Иконки</a></li>
<li><a href="http://web-prostor.net/raznoe/temp/" >Шаблоны</a></li>
<li><a href="http://web-prostor.net/raznoe/screensaver/" >Screensavers</a></li>
<li><a href="http://web-prostor.net/raznoe/script/" >Scripts | Скрипты</a></li>
</ul>

<h3 class="menuheader" style="cursor: default"">Контактная информация</h3>
<div>
<b>ICQ</b> - 320856202 <br> 
<b>email</b> - volkodav@ymail.com<br>
<b>email(2)</b> - web-prostor.net@yandex.ru
</div>


</div>
	</div>


			<div class="block-bottom">
				<div class="bbottom-left"></div>
				<div class="bbottom-right"></div>
			</div>
			<!-- Блок МЕНЮ Конец -->


            
		</div></div>


    <!-- Подвал Начало -->
                       <div id="footer">
<a href="http://web-prostor.net/help.html"><font color="#C9D825"> <b>Пожертвования</b></font></a> | 
<a href="http://web-prostor.net/wpn_static/about_us.html"><font color="#C9D825"> <b>About Us</b></font></a> | 
<a href="http://web-prostor.net/wpn_static/reklama.html"><font color="#C9D825"> <b>Реклама</b></font></a> | 
<a href="http://web-prostor.net/wpn_static/category.html"><font color="#C9D825"><b>Категории новостей</b></font></a> | 
<a href="http://web-prostor.net/wpn_static/team.html"><font color="#C9D825"><b>Набор в команду сайта</b></font></a> 

</div>
	</div>
    <div style="float:left;">
<font color=white><b>Для правильного отображения страниц сайта мы рекомендуем Вам воспользоваться <a href="http://www.mozilla.com/en-US/products/download.html?product=firefox-2.0.0.11&os=win&lang=ru"><font color=white>Mozzila FireFox</font></a></b></font><br>
<b><volk>Место для Вашей рекламы</volk></b><br>
<a href="http://www.findmoreedu.org/" target="blank" >
<img alt="Website counter" hspace="0" vspace="0" border="0" src="http://www.totallyfreecounter.com/895420rhtsbo/counter.img?theme=23&digits=4"/>
</a>
<noscript><br/><a href="http://www.totallyfreecounter.com/">Free Counter</a><br>The following text will not be seen after you upload your website, please keep it in order to retain your counter functionality <br> <a href="http://www.xn--onlinecasin-dfb.com" target="_blank">online casino free bonus</a></noscript>
</div>


    <!-- И Уже Конец -->
<!-- begin of Top100 code -->
<script id="top100Counter" type="text/javascript" src="http://counter.rambler.ru/top100.jcn?1566929"></script><noscript><img src="http://counter.rambler.ru/top100.cnt?1566929" alt="" width="1" height="1" border="0"></noscript>
<!-- end of Top100 code -->


<script>
var __rt= Math.round(Math.random() * 100000);
document.write('<scr'+'ipt language="javascript" type="text/javascript" src="http://luxup.ru/show/1417/?div=lx_1417&rt='+__rt+'&r='+escape(document.referrer)+'"><'+'/scr'+'ipt>');
</script>

<script>
var __rt= Math.round(Math.random() * 100000);
document.write('<scr'+'ipt language="javascript" type="text/javascript" src="http://luxup.ru/show/1540/?div=lx_1540&rt='+__rt+'&r='+escape(document.referrer)+'"><'+'/scr'+'ipt>');
</script>

<a class="button_top" id="toTop" href="#">
    <img src="{THEME}/js/FrosT.Infernal.Customs.Interface/elements/to_top.png" alt="" />ВВЕРХ</a>
</a>
                     

<!--opisanie saita-->


</body>
</html>
</body>
</html>

**volkodav** · 04-22-2009, 03:24 PM

you can close this thread
thaks

I found the problem

**Snookerman** · 04-22-2009, 03:26 PM

You could post the solution in case someone else has the same problem. If you don't want to, I can delete the thread. Your choice.

**volkodav** · 04-22-2009, 04:30 PM

It was my fault

I put

Code:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

twise

Thread: Problem in IE with Accordion Menu

Thread Tools

Search Thread

Problem in IE with Accordion Menu

Bookmarks

Bookmarks

Posting Permissions