Выпадающее меню в runtime на JavaScript
От: solos Украина www.belton.com.ua
Дата: 21.01.03 07:17
Оценка:
Идея в том, что бы сделать вертикальное выпадаюющее меню по принципу "кликнул на пункт — выпало подменю — все следующие пункты сместились вниз". То есть, в принципе, rsdn-овское меню. Но проблема лишь в том, что сделать это надо на JavaScript, при условии, что страница НЕ должна перегружаться при выводе подменю.

Большая просьба намекнуть, как это сделать, или указать на соответствующий исходник.

Спасибо.
WBR, solos.
Re: Выпадающее меню в runtime на JavaScript
От: Flamer Кипр http://users.livejournal.com/_flamer_/
Дата: 21.01.03 07:22
Оценка: 12 (1)
Здравствуйте, solos, Вы писали:

[]

S>Большая просьба намекнуть, как это сделать, или указать на соответствующий исходник.

В работе
Исходник
Re: Выпадающее меню в runtime на JavaScript
От: Ermek Казахстан  
Дата: 21.01.03 07:34
Оценка:
Здравствуйте, solos, Вы писали:

S>Идея в том, что бы сделать вертикальное выпадаюющее меню по принципу "кликнул на пункт — выпало подменю — все следующие пункты сместились вниз". То есть, в принципе, rsdn-овское меню. Но проблема лишь в том, что сделать это надо на JavaScript, при условии, что страница НЕ должна перегружаться при выводе подменю.

S>Большая просьба намекнуть, как это сделать, или указать на соответствующий исходник.

S>Спасибо.




<style>
<!--
DIV.clTop{position:absolute; width:170}
DIV.clSub{position:absolute; left:10; width:170}
#divCont{position:relative; left:100; top:0; height:400; width:170;}
A.clMain{font-family:Arial, Verdana, Helvetica, Helv; font-size:14px; text-decoration:none; font-weight:bold; color:black}
A.clSubb{font-family:Arial, Verdana, Helvetica, Helv; font-size:14px; text-decoration:none; color:black}
#divMain{position:absolute}
//-->
</style>
<script language="JavaScript">
var stayFolded=false
var n = (document.layers) ? 1:0;
var ie = (document.all) ? 1:0;
var browser=((n || ie) && parseInt(navigator.appVersion)>=4)  
function makeMenu(obj,nest){
    nest=(!nest) ? '':'document.'+nest+'.'                                        
    this.css=(n) ? eval(nest+'document.'+obj):eval('document.all.'+obj+'.style')                    
       this.ref=(n) ? eval(nest+'document.'+obj+'.document'):eval('document');        
    this.height=n?this.ref.height:eval(obj+'.offsetHeight')
    this.x=(n)? this.css.left:this.css.pixelLeft;this.y=(n)? this.css.top:this.css.pixelTop;                            
    this.hideIt=b_hideIt;    this.showIt=b_showIt; this.vis=b_vis; this.moveIt=b_moveIt                                            
    return this
}
function b_showIt(){this.css.visibility="visible"}
function b_hideIt(){this.css.visibility="hidden"}
function b_vis(){if(this.css.visibility=="hidden" || this.css.visibility=="hide") return true;}
function b_moveIt(x,y){this.x=x; this.y=y; this.css.left=this.x; this.css.top=this.y}
function init(){
    oTop=new Array()
    oTop[0]=new makeMenu('divTop1','divCont')
    oTop[1]=new makeMenu('divTop2','divCont')
    oTop[2]=new makeMenu('divTop3','divCont')
    oTop[3]=new makeMenu('divTop4','divCont')
    oTop[4]=new makeMenu('divTop5','divCont')
    oTop[5]=new makeMenu('divTop6','divCont')
    oSub=new Array()
    oSub[0]=new makeMenu('divSub1','divCont.document.divTop1')
    oSub[1]=new makeMenu('divSub2','divCont.document.divTop2')
    oSub[2]=new makeMenu('divSub3','divCont.document.divTop3')
    oSub[3]=new makeMenu('divSub4','divCont.document.divTop4')
    oSub[4]=new makeMenu('divSub5','divCont.document.divTop5')
    oSub[5]=new makeMenu('divSub6','divCont.document.divTop6')
    for(i=0;i<oSub.length;i++){ oSub[i].hideIt() }
    for(i=1;i<oTop.length;i++){ oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height) }
}
function menu(num){
    if(browser){
        if(!stayFolded){
            for(i=0;i<oSub.length;i++){
                if(i!=num) oSub[i].hideIt()
            }
            for(i=1;i<oTop.length;i++){
                oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height)
            }
        }
        oSub[num].vis()?oSub[num].showIt():oSub[num].hideIt()
        for(i=1;i<oTop.length;i++){ 
            if(!oSub[i-1].vis()) oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height+oSub[i-1].height) 
            else oTop[i].moveIt(0,oTop[i-1].y+oTop[i-1].height)
        }
    }
}
if(browser) onload=init;

</script>

</HEAD>
<BODY bgcolor="white">
<div id="divCont">
    <div id="divTop1" class="clTop"><a href="#" onclick="menu(0); return false" class="clMain">[Меню 0]</a><br>
        <div id="divSub1" class="clSub">
            <a href="#" class="clSubb">-Sub 1</a><br>
            <a href="#" class="clSubb">-Sub 2</a><br>
            <a href="#" class="clSubb">-Sub 3</a><br>
            <a href="#" class="clSubb">-Sub 4</a><br>
        </div><br>
    </div>
    <div id="divTop2" class="clTop"><a href="#" onclick="menu(1); return false" class="clMain">[Меню 1]</a><br>
        <div id="divSub2" class="clSub">
            <a href="#" class="clSubb">-Sub 1</a><br>
            <a href="#" class="clSubb">-Sub 2</a><br>
        </div><br>
    </div>
    <div id="divTop3" class="clTop"><a href="#" onclick="menu(2); return false" class="clMain">[Меню 2]</a><br>
        <div id="divSub3" class="clSub">
            <a href="#" class="clSubb">-Sub 1</a><br>
            <a href="#" class="clSubb">-Sub 2</a><br>
            <a href="#" class="clSubb">-Sub 3</a><br>
        </div><br>
    </div>
    <div id="divTop4" class="clTop"><a href="" onclick="menu(3); return false" class="clMain">[Меню 3]</a><br>
        <div id="divSub4" class="clSub">
            <a href="#" class="clSubb">-Sub 1</a><br>
            <a href="#" class="clSubb">-Sub 2</a><br>
        </div><br>
    </div>
    <div id="divTop5" class="clTop"><a href="" onclick="menu(4); return false" class="clMain">[Меню 4]</a><br>
        <div id="divSub5" class="clSub">
            <a href="#" class="clSubb">-Sub 1</a><br>
            <a href="#" class="clSubb">-Sub 2</a><br>
            <a href="#" class="clSubb">-Sub 3</a><br>
            <a href="#" class="clSubb">-Sub 4</a><br>
            <a href="#" class="clSubb">-Sub 5</a><br>
        </div><br>
    </div>
    <div id="divTop6" class="clTop"><a href="" onclick="menu(5); return false" class="clMain">[Меню 5]</a><br>
        <div id="divSub6" class="clSub">
            <a href="#" class="clSubb">-Sub 1</a><br>
        </div><br>
    </div>
</div>
Быть живым — мое ремесло,
Это дерзость, но это в крови!
Re: Выпадающее меню в runtime на JavaScript
От: Виталий Россия  
Дата: 21.01.03 07:58
Оценка:
Здравствуйте, solos, Вы писали:

S>Идея в том, что бы сделать вертикальное выпадаюющее меню по принципу "кликнул на пункт — выпало подменю — все следующие пункты сместились вниз". То есть, в принципе, rsdn-овское меню. Но проблема лишь в том, что сделать это надо на JavaScript, при условии, что страница НЕ должна перегружаться при выводе подменю.

S>Большая просьба намекнуть, как это сделать, или указать на соответствующий исходник.

Посмотри здесь, если маловато функционала, то могу выслать исходник дерева с возможностью назначения картинок на узлы (папка открыта/закрыта, разные элементы — разные иконки), отрисовкjq линий дерева и т.д., но это если что только вечером — исходники дома

S>Спасибо.
Re[2]: Выпадающее меню в runtime на JavaScript
От: solos Украина www.belton.com.ua
Дата: 21.01.03 10:41
Оценка:
Здравствуйте, Flamer, Вы писали:

F>Здравствуйте, solos, Вы писали:

F>[]

S>>Большая просьба намекнуть, как это сделать, или указать на соответствующий исходник.

F>В работе
F>Исходник


Спасибо, но я имел ввиду ВЕРТИКАЛЬНУЮ менюху, например как на http://www.stels.net/
WBR, solos.
Re: Выпадающее меню - dhtmlcentral.com
От: Adward Россия http://www.sprut.ru
Дата: 21.01.03 13:18
Оценка:
Здравствуйте, solos, Вы писали:

S>Идея в том, что бы сделать вертикальное выпадаюющее меню по принципу "кликнул на пункт — выпало подменю — все следующие пункты сместились вниз". То есть, в принципе, rsdn-овское меню. Но проблема лишь в том, что сделать это надо на JavaScript, при условии, что страница НЕ должна перегружаться при выводе подменю.

S>Большая просьба намекнуть, как это сделать, или указать на соответствующий исходник.

Для всякого рода менюх рекомендую www.dhtmlcentral.com
конкретно твою менюху можно увидеть здесь

всё круто настраивается, если что — спроси — я как раз её на сайт влепил.
реализация других менюшек на этом сайте http://www.dhtmlcentral.com/script/search.asp?category=menu

кроссбраузерная хрень
Re: Выпадающее меню в runtime на JavaScript
От: GrayWolf Россия https://kini24.ru
Дата: 21.01.03 16:49
Оценка:
Здравствуйте, solos...

Могу предложить такой адрес — http://nai.wallst.ru. Исходник — в коде страницы. Очень просто...
Re: Выпадающее меню в runtime на JavaScript
От: adontz Грузия http://adontz.wordpress.com/
Дата: 21.01.03 21:00
Оценка:
Здравствуйте, solos, Вы писали:

http://adontz.narod.ru/contents.htm ? там дерево как на RSDN
A journey of a thousand miles must begin with a single step © Lau Tsu
Re: Выпадающее меню в runtime на JavaScript
От: Аноним  
Дата: 23.01.03 06:09
Оценка:
Здравствуйте, solos, Вы писали:

S>Идея в том, что бы сделать вертикальное выпадаюющее меню по принципу "кликнул на пункт — выпало подменю — все следующие пункты сместились вниз". То есть, в принципе, rsdn-овское меню. Но проблема лишь в том, что сделать это надо на JavaScript, при условии, что страница НЕ должна перегружаться при выводе подменю.

S>Большая просьба намекнуть, как это сделать, или указать на соответствующий исходник.

S>Спасибо.

Есть хорошая программа, создание меню за 5 минут любое
называется Sothink DHTMLMenu пиши на мыло скину nadr@ivnet.ru
 
Подождите ...
Wait...
Пока на собственное сообщение не было ответов, его можно удалить.