VPF::Помогите преобразовать скрипт меню

AztEK

Дата 7.11.2005, 13:49 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 723
Регистрация: 4.1.2005

Репутация: нет
Всего: 18

В этом форуме в форме отправки сообщения есть кнопочка "Код". По нажатию вылезает меню выбора. Помогите модифицировать её в горизонтальное выпадоющее меню.

--------------------

Linux is like wigwam -- no windows, no gates, apache inside.

DEER

Дата 7.11.2005, 14:06 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 749
Регистрация: 12.4.2005
Где: г. Рязань

Репутация: 2
Всего: 13

там скорее всего используется таблица, если так
то все должно выглядеть примерно вот так

Код


<table>
<tr тут для каких то событий какие то функции><td>HTML</td></tr>
<tr тут для каких то событий какие то функции><td>javascript</td></tr>
.....
</table>

тебе тогда надо будет писать так

Код


<table>
<tr><td тут для каких то событий какие то функции>HTML</td>
<td тут для каких то событий какие то функции>javascript</td></tr>
.....
</table>

т.е. всё сувать в одну страничку... и скорее всего придется маленько переделать сами функции
Добавлено @ 14:06
а ещё лучше выложить код, который хочешь переделать smile

--------------------

AztEK

Дата 7.11.2005, 18:58 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 723
Регистрация: 4.1.2005

Репутация: нет
Всего: 18

Уфф...полдня работы не прошли даром.Вот:

HTML:

Код


<html><head> <title>Делаем красивое меню</title>
<style type="text/css"><!--
button { 
    vertical-align: middle; 
    font-size:12px; 
    font-family: Arial; 
    background-color:#eee; 
    width: 50px;
    border: 1px #bbb solid
}
.buttonmenu{
top:0;
left:0;
z-index:2;
position:absolute;
visibility:hidden;
border-style:solid;
border-width:1px;
border-color:#C1C1C1;
background-color:#F6F6F6;
}
.buttonmenu ul{
margin:0;
list-style:none;
padding:.5em;
}
.buttonmenu li{
padding:.25em;
border-width:1px;
border-style:solid;
border-color:#F6F6F6;
}
.buttonmenu li.hover{background-color:#E6E6E6;border-color:#C1C1C1;}
div{font-size: 11px;} 
a {FONT-FAMILY: Arial, Arial Cyr, MS Sans-serif; }
A:link {COLOR: #000000; TEXT-DECORATION: none; } 
A:visited {COLOR: #000000; TEXT-DECORATION: none; }
A:hover {TEXT-DECORATION: none; }
 -->
</style>
</head>
<script language="javascript" type="text/javascript" src="menu.js"></script>
<body>
</body>
</html>

menu.js:

Код


function getLanguages()
{
knames="cpp,cppb,delphi,vb,csharp,asm,perl,php,asp,java,javascript,sql,foxpro,html,css";
rnames="C++,C++ Borland,Delphi,Visual Basic,C#,Assembler,Perl,PHP,ASP,Java,Javascript,SQL,FoxPro,HTML,CSS";

var k_names=knames.split(',');
var r_names=rnames.split(',');

var html='<button id="replytop" onClick="">Код</button>';
html+='<div id="replymenu" class="buttonmenu">';
html+='<center><ul>';

for(y=0;y<k_names.length;y++)
{
    html += makeCodeOption(k_names[y],r_names[y]);
}

html += makeCodeOption("exit","Без Подсветки");
html +='</ul>';
html +='</div><script>MenuButton("replytop","replymenu");</script>';

return html;
}

function makeCodeOption(langID,langName)
{
    var html = '<a href="index.php?'+langID+'" about=_blank><li value="0">'+langName+'</li></a>';
    return html;
}

function Reply_Click()
{
    if(this.Menu.opened)
    {
        HideMenu();
    }
    else
    {
        this.Menu.Show();
    }
};

function ylib_getPageX(o) {  var x=0; while(eval(o)) { x+=o.offsetLeft; o=o.offsetParent; }  return x; };
function ylib_getPageY(o) {  var y=0; while(eval(o)) { y+=o.offsetTop; o=o.offsetParent; }  return y; };

function Menu_Click(p_oEvent)
{
    var oEvent = p_oEvent ? p_oEvent : window.event;
    var oSender = p_oEvent ? oEvent.target : oEvent.srcElement;
    if(p_oEvent) oEvent.stopPropagation();
    else oEvent.cancelBubble = true;
    this.Sender = oSender;
    this.Event = oEvent;
    HideMenu();
};

function Menu_MouseOver(p_oEvent)
{
    var oEvent = p_oEvent ? p_oEvent : window.event;
    var oSender = p_oEvent ? oEvent.target : oEvent.srcElement;

    if(oSender.tagName == 'LI') oSender.className = 'hover';
    else return false;
};

function Menu_MouseOut(p_oEvent)
{
    var oEvent = p_oEvent ? p_oEvent : window.event;
    var oSender = p_oEvent ? oEvent.target : oEvent.srcElement;

    if(oSender.tagName == 'LI') oSender.className = '';
    else return false;
};

function Button_Click(p_oEvent)
{
    var oEvent = p_oEvent ? p_oEvent : window.event;
    var oSender = p_oEvent ? oEvent.target : oEvent.srcElement;

    if(p_oEvent) oEvent.stopPropagation();
    else oEvent.cancelBubble = true;

    this.Event = oEvent;
    this.Sender = oSender;

    this.Menu.Button = this;
    g_oMenu = this.Menu;

    this.ClickHandler();

    document.onclick = HideMenu;
};

function ButtonMenu(p_sMenuId)
{
    var oMenu = document.getElementById(p_sMenuId);

    if(oMenu)
    {
        oMenu.opened=false;

        oMenu.Show = function () 
        {
            if(document.all) this.style.width = this.offsetWidth+'px';
            oMenu.opened=true;
            this.style.top = ylib_getPageY(this.Button)+this.Button.offsetHeight-1+'px';
            this.style.left = ylib_getPageX(this.Button)+'px';
            this.style.visibility = 'visible';
        };

        oMenu.onclick = Menu_Click;

        if(document.all)
        {
            oMenu.onmouseover = Menu_MouseOver;
            oMenu.onmouseout = Menu_MouseOut;
        }
        return oMenu;
        
    }
    else return false;
    
};

function Button(p_sButtonId)
{
    var oButton = document.getElementById(p_sButtonId);
    oButton.saveclick=oButton.onclick;
    oButton.onclick = Button_Click;
    return oButton;
};

function MenuButton(p_sButtonId, p_sMenuId)
{
    var oButton = new Button(p_sButtonId);

    if(oButton)
    {
        oButton.ClickHandler = Reply_Click;
        oButton.Menu = new ButtonMenu(p_sMenuId);
        return oButton;
    }
    else return false;
};

function HideMenu()
{
    if(g_oMenu)
    {
        g_oMenu.opened=false;
        g_oMenu.style.visibility = 'hidden';
        g_oMenu = null;
        document.onclick = null;
        window.onresize = null;
    }
    else return;
};
document.write(getLanguages());

Добавлено @ 18:59
И довольно симпатично получилось! smile

--------------------

Linux is like wigwam -- no windows, no gates, apache inside.

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »