Эффекты на основе Java Script

Вертикальное меню с подменю

Скопируйте и вставте

Внутри тега <HEAD> - </HEAD>

Все стили и параметры меню задаются в CSS таблице. Там всё основное подписано.

Внутри тега <BODY> - </BODY> там где у Вас будет меню.

<table cellspacing="0" cellpadding="0" id="click-menu1" class="click-menu">
    <tr>
        <td>
            <div class="box1">Menu 1<img src="http://skriptkpbstudio.ucoz.ru/demo_srt/menu_wert/552/images/arrow1.gif" width="11" height="11" alt=""></div>
            <div class="section">
                <div class="box2"><img src="http://skriptkpbstudio.ucoz.ru/demo_srt/menu_wert/552/images/arrow2.gif" width="14" height="9" alt=""><a href="#">Product One</a></div>
                <div class="box2"><img src="http://skriptkpbstudio.ucoz.ru/demo_srt/menu_wert/552/images/arrow2.gif" width="14" height="9" alt=""><a href="#">Product Two</a></div>
                <div class="box2"><img src="http://skriptkpbstudio.ucoz.ru/demo_srt/menu_wert/552/images/arrow2.gif" width="14" height="9" alt=""><a href="#">Product Three</a></div>
                <div class="box2"><img src="http://skriptkpbstudio.ucoz.ru/demo_srt/menu_wert/552/images/arrow2.gif" width="14" height="9" alt=""><a href="#">Product Four</a></div>
                <div class="box2"><img src="http://skriptkpbstudio.ucoz.ru/demo_srt/menu_wert/552/images/arrow2.gif" width="14" height="9" alt=""><a href="#">Product Five</a></div>
            </div>
        </td>
    </tr>
    <tr><td height="2"></td></tr>
    <tr>
        <td>
            <div class="box1">Menu 2<img src="http://skriptkpbstudio.ucoz.ru/demo_srt/menu_wert/552/images/arrow1.gif"></div>
            <div class="section">
                <div class="box2"><img src="http://skriptkpbstudio.ucoz.ru/demo_srt/menu_wert/552/images/arrow2.gif" width="14" height="9" alt=""><a href="#">Product One</a></div>
                <div class="box2"><img src="http://skriptkpbstudio.ucoz.ru/demo_srt/menu_wert/552/images/arrow2.gif" width="14" height="9" alt=""><a href="#">Product Two</a></div>
                <div class="box2"><img src="http://skriptkpbstudio.ucoz.ru/demo_srt/menu_wert/552/images/arrow2.gif" width="14" height="9" alt=""><a href="#">Product Three</a></div>
            </div>
        </td>
    </tr>
    <tr><td height="2"></td></tr>
    <tr>
        <td>
            <div class="box1"><div class="box2"><img src="http://skriptkpbstudio.ucoz.ru/demo_srt/menu_wert/552/images/arrow2.gif" width="14" height="9" alt=""><a class="ssylka" href="#" title="Это ссылка а не меню">Ssylka</a></div></div>
            
        </td>
    </tr>
    <tr><td height="2"></td></tr>
    <tr>
        <td>
            <div class="box1">Menu 3<img src="http://skriptkpbstudio.ucoz.ru/demo_srt/menu_wert/552/images/arrow1.gif" width="11" height="11" alt=""></div>
            <div class="section">
                <div class="box2"><img src="http://skriptkpbstudio.ucoz.ru/demo_srt/menu_wert/552/images/arrow2.gif" width="14" height="9" alt=""><a href="#">Partner Benefits</a></div>
                <div class="box2"><img src="http://skriptkpbstudio.ucoz.ru/demo_srt/menu_wert/552/images/arrow2.gif" width="14" height="9" alt=""><a href="#">Partner Application</a></div>
                <div class="box2"><img src="http://skriptkpbstudio.ucoz.ru/demo_srt/menu_wert/552/images/arrow2.gif" width="14" height="9" alt=""><a href="#">Partner Listing</a></div>
            </div>
        </td>
    </tr>
    <tr><td height="2"></td></tr>
    <tr>
        <td>
            <div class="box1">Menu 4<img src="images/arrow1.gif" width="11" height="11" alt=""></div>
            <div class="section">
                <div class="box2"><img src="images/arrow2.gif" width="14" height="9" alt=""><a href="#">Customer One</a></div>
                <div class="box2"><img src="images/arrow2.gif" width="14" height="9" alt=""><a href="#">Customer Two</a></div>
                <div class="box2"><img src="images/arrow2.gif" width="14" height="9" alt=""><a href="#">Customer Three</a></div>
                <div class="box2"><img src="images/arrow2.gif" width="14" height="9" alt=""><a href="#">Customer Four</a></div>
                <div class="box2"><img src="images/arrow2.gif" width="14" height="9" alt=""><a href="#">Customer Five</a></div>
                <div class="box2"><img src="images/arrow2.gif" width="14" height="9" alt=""><a href="#">Customer Six</a></div>
                <div class="box2"><img src="images/arrow2.gif" width="14" height="9" alt=""><a href="#">Customer Seven</a></div>
            </div>
        </td>
    </tr>
    <tr><td height="2"></td></tr>
    <tr>
        <td>
            <div class="box1">Menu 5<img src="images/arrow1.gif" width="11" height="11" alt=""></div>
            <div class="section">
                <div class="box2"><img src="images/arrow2.gif" width="14" height="9" alt=""><a href="#">Executive Team</a></div>
                <div class="box2"><img src="images/arrow2.gif" width="14" height="9" alt=""><a href="#">Investors</a></div>
                <div class="box2"><img src="images/arrow2.gif" width="14" height="9" alt=""><a href="#">Career</a></div>
                <div class="box2"><img src="images/arrow2.gif" width="14" height="9" alt=""><a href="#">Press Center</a></div>
                <div class="box2"><img src="images/arrow2.gif" width="14" height="9" alt=""><a href="#">Success Stories</a></div>
                <div class="box2"><img src="images/arrow2.gif" width="14" height="9" alt=""><a href="#">Contact Us</a></div>
            </div>
        </td>
    </tr>
    </table>

Здесь всё должно быть понятно. Колличество меню и ссылок в основном меню и колличество ссылок в каждом подменю на Ваше усмотрение.

И Вы будите использовать скрипт прямо из моей библиотеки не загружая его к себе на страницу.
Вы экономите место и время.

Если Вы хотите иметь скрипт, чтобы изменять и другие его параметры, воспользуйтесь функцией [Скачать с сервера].
Если Вы не видите этой функции в []- следовательно Вы не зарегистрированы на сайте.Вам надо зарегистрироваться и войти как Пользователь.