|
|
|
|
|
для: Footer
(28.01.2008 в 14:24)
| | Короче есть вот заготовка, только не совсем отлаженая, и демо вариант. С этим принципом меню любой вложенности делать можно.
table.child {background: #FFFFFF; position: absolute; text-align: center; visibility: hidden}
table.parent { position: absolute; text-align: center}
td {background: #c0c0c0; font-size: small;}
/* End of style section. Generated by AceHTML at 29.05.2007 10:35:11 */
-->
</style>
</head>
<body style="font-size: xx-large">
<div style="position: absolute; left: 200px">
<script>
var menu=Array("О нас","Новейшие достижения","Ссылки","Реклама","Мои фотки")
var menu1=new Array();
menu1[0]=Array("Кто мы","Как нас зовут","Сколько нам лет");
menu1[1]=Array("Спортивные достижения","Производственные достижения","Научные достижения");
menu1[2]=Array("Левые ссылки","Хорошие ссылки");
menu1[3]=Array("Наша реклама","Чужая реклама","Реклама с дружественных ресурсов");
var h=30; //Высота строки
var wg=200; // Ширина главного меню
var wl=300; //Ширина локального меню
var bc="#000000"; //Цвет границы рамки
var b=0; //Толщина рамки
var cc=2; //Толщина границы между ячейками
var cd=2; //Толщина границы между рамкой и текстом
var d=document;
function in1(id)
{var elem=document.getElementById(id);
elem.style.visibility='visible';
}
function out1(id)
{var elem=document.getElementById(id);
elem.style.visibility='hidden';
}
function in2(th)
{th.style.backgroundColor="#d3d3d3";
th.style.cursor="hand";
}
function out2(th)
{th.style.backgroundColor="#c0c0c0";
}
function h1(i)
{if(menu1[i])return(h*menu1[i].length)
else return(h);
}
//Глобальное меню
d.write("<table class='parent' width='"+wg+"' height='"+(h*menu.length)+"'border='"+b+"' bordercolor='"+bc+"' cellspacing='"+cc+"' cellpadding='"+cd+"' style='position: absolute'>");
for(i=0;i<menu.length;i++)
{d.write(" <tr>");
d.write(" <td onmouseover=in1('child"+i+"',this),in2(this) onmouseout=out1('child"+i+"',this),out2(this)>"+menu[i]+"</td>");
d.write(" </tr>");
}
d.write("</table>");
//Локальные меню
for(i=0;i<=menu.length;i++)
{d.write(" <table class='child' ID='child"+i+"' onmouseover=in1('child"+i+"') onmouseout=out1('child"+i+"') width='"+wl+"' height='"+h1(i)+"' border='"+b+"' bordercolor='"+bc+"' cellpadding='"+cd+"' cellspacing='"+cc+"' style='visibility: hidden; left:"+(wg-3)+"; top:"+(h*i)+";'");
for(a=0;a<menu1[i].length;a++)
{ d.write("<tr>");
d.write(" <td onmouseover=in2(this) onmouseout=out2(this)>"+menu1[i][a]+"</td>");
d.write(" </tr>");
}
d.write("</table>");
}
</script>
</div>
|
| |
|
|
|
|
|
|
|
для: elenaki
(29.01.2008 в 13:38)
| | Скачал меню. Настроил. Но вылезает текст при наведении на пункты меню о том, что нужно разеригстрировать этот продукт. Ребят, а как его убрать самому, чтобы не платить за программу? Прилагаю два файла, которые должны быть на сайте. Помогите, пожалуйста, убрать их рекламу. | |
|
|
|
|
|
|
|
для: Footer
(29.01.2008 в 12:52)
| | пойти по ссылке download и скачать | |
|
|
|
|
|
|
|
для: Footer
(28.01.2008 в 14:24)
| | Так всё таки, как вытащить из этого сайта меню? Хелп! | |
|
|
|
|
|
|
|
для: elenaki
(26.01.2008 в 18:28)
| | Я сейчас зашёл на http://www.milonic.com/ Там сразу на этой странице есть горизонтальное меню трёхуровневое. Мне вот такое нужно. Но не получается понять как оно построено. Помогите, плиз, кодом JavaScripta, который там работает. | |
|
|
|
|
|
|
|
для: Footer
(26.01.2008 в 07:24)
| | document.onclick=change
наверно, надо сделать тут onmouseover...
не думаю, что будет хорошо. будет сильно дергаться. навести мыша можно случайно, в то время как щелканье обычно прицельно производится. | |
|
|
|
|
|
|
|
для: elenaki
(25.01.2008 в 19:35)
| | . | |
|
|
|
|
|
|
|
для: elenaki
(25.01.2008 в 19:35)
| | Спасибо, всё работает. Но ещё такой вопрос: там чтобы открылось подменю, нужно щёлкнуть на пункт меню, а можно как-то сделать, чтобы просто при наведении на пункт меню выпадало подменю, то есть без щёлчка? | |
|
|
|
|
|
|
|
для: Footer
(25.01.2008 в 19:20)
| | Содержимое этой таблицы поместите между <HEAD> и </HEAD>
<style>
<!--
#foldheader{cursor:hand ; font-weight:bold ;
list-style-image:url(fold.gif)}
#foldinglist{list-style-image:url(list.gif)}
//-->
</style>
<script language="JavaScript1.2">
<!--
/**
* Based on Folding Menu Tree
* Dynamic Drive (www.dynamicdrive.com)
* For full source code, installation instructions,
* 100's more DHTML scripts, and Terms Of
* Use, visit dynamicdrive.com
*
* Updated to support arbitrarily nested lists
* by Mark Quinn (mark@robocast.com) November 2nd 1998
*/
var head="display:''"
img1=new Image()
img1.src="fold.gif"
img2=new Image()
img2.src="open.gif"
function change(){
if(!document.all)
return
if (event.srcElement.id=="foldheader") {
var srcIndex = event.srcElement.sourceIndex
var nested = document.all[srcIndex+1]
if (nested.style.display=="none") {
nested.style.display=''
event.srcElement.style.listStyleImage="url(open.gif)"
}
else {
nested.style.display="none"
event.srcElement.style.listStyleImage="url(fold.gif)"
}
}
}
document.onclick=change
//-->
</script>
|
Содержимое этой таблицы поместите между <BODY> и </BODY>
<ul>
<li id="foldheader">Новости</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href="http://www.cnn.com">CNN</a></li>
<li><a href= "http://www.abcnews.com">ABC News</a></li>
<li><a href= "http://www.vancouversun.com">Vancouver Sun</a></li>
</ul>
<li id="foldheader">Игры</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href= "http://www.gamespot.com">GameSpot</a></li>
<li><a href= "http://www.happypuppy.com">Happy Puppy</a></li>
<li><a href= "http://www.gamecenter.com">Game Center</a></li>
</ul>
<li id="foldheader">Софт</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href="http://www.download.com">outer 1</a></li>
<li><a href="http://www.hotfiles.com">outer 2</a></li>
<li id="foldheader">JavaScript & DHTML</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href= "http://www.dynamicdrive.com">Dynamicdrive </a> </li>
<li><a href="http://javashelp.cjb.net">JS Help</a></li>
</ul>
<li><a href="http://www.windows95.com">outer 3</a></li>
<li><a href="http://www.shareware.com">outer 4</a></li>
</ul>
</ul>
<script language="JavaScript1.2">
<!--
/**
* Get cookie routine by Shelley Powers
* (shelley.powers@ne-dev.com)
*/
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
// if cookie exists
if (offset != -1) {
offset += search.length
// set index of beginning of value
end = document.cookie.indexOf(";", offset);
// set index of end of cookie value
if (end == -1) end = document.cookie.length;
returnvalue= unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
if (get_cookie(window.location.pathname) != ''){
var openresults= get_cookie(window.location.pathname).split(" ")
for (i=0 ; i < openresults.length ; i++){
foldinglist[openresults[i]].style.display=''
document.all[foldinglist[openresults[i]].sourceIndex -
1].style.listStyleImage="url(open.gif)"
}
}
if (document.all){
var nodelength=foldinglist.length-1
var nodes=new Array(nodelength)
var openones=''
}
function check(){
for (i=0 ; i <= nodelength ; i++){
if (foldinglist[i].style.display=='')
openones=openones + " " + i
}
document.cookie=window.location.pathname+"= "+openones
}
if (document.all)
document.body.onunload=check
//-->
</script>
|
-------------------------------------------------------------------------------- | |
|
|
|
|
|
|
|
для: elenaki
(25.01.2008 в 19:09)
| | Не очень понял что там и как. Я не очень разбираюсь в JavaScriptе. Получается, мне нужно три уровня. Как тогда сделать для трёх уровней? | |
|
|
|
|