www.webdeveloper.com
Results 1 to 4 of 4

Thread: Combine Two Effects? Help

  1. #1
    Join Date
    Jul 2003
    Posts
    71

    Question Combine Two Effects? Help

    Ok this is want I want to do. I have 2 different menus and I would like to add an effect to one of them.

    The first menu which is the menu I want to use has a cool fading effect, that is here:

    http://www14.brinkster.com/rekcah/fade.html

    The second menu has the effect that I want to add to the first one it is a drop down menu:

    http://www14.brinkster.com/rekcah/dropdown.html

    I am not sure how to do this. Im not going to post the code because is long so just use view - source.

    Please help me out, thanx

  2. #2
    Join Date
    Jul 2003
    Posts
    71
    does anyone know how to do this?

  3. #3
    Join Date
    Jul 2003
    Posts
    71
    heres the code for the fade effect menu:

    <HTML>
    <HEAD>

    <SCRIPT LANGUAGE="JavaScript">
    <!-- Begin
    function locktrueie(myform){myform.ie.checked=true;}
    function lockfalsenet(myform){myform.nets.checked=true;}
    function goToURL() { window.location = ""; }

    function nochange(mycheckbox)
    {
    if (mycheckbox.checked == true){mycheckbox.checked = false;}else{mycheckbox.checked = true;}
    }

    // End -->
    </script>
    </HEAD>
    <BODY>

    <style>
    . tds
    {
    background-Color:BLACK;
    width:100;
    height:20;
    text-align:center;
    border:1px RED;
    font-size:14;
    filter:alpha(opacity=45);
    -moz-opacity:45%;
    cursor:crosshair;
    }
    </style>

    <script language="javascript">
    nOpac = 50
    nPlus = 2
    nMin = 1
    speed = 30
    timer = null;
    timer2 = null;

    var ie5=(document.all && document.getElementById);
    var ns6=(!document.all && document.getElementById);

    function fadeImg2(teller)
    {
    apl[teller][1] = "Up";
    changes();
    }

    function fadeImgend2(teller)
    {
    apl[teller][1] = "Down";
    setTimeout("changes()",50);
    }

    function changes()
    {
    next_loop = true;
    for (i=0;i<apl.length;i++)
    {
    obj = link_table.rows[i].cells[0];
    opacity = apl[i][0]
    if (apl[i][1] == "Up")
    {
    opacity += nPlus;
    apl[i][0] = opacity;
    if (apl[i][0] > 105)
    {apl[i][1] = "";}
    else
    {next_loop = false;}
    nOpac = opacity;
    }
    else
    {
    if (apl[i][1] == "Down")
    {
    opacity -= nMin;
    apl[i][0] = opacity;
    if (apl[i][0] < 45)
    {apl[i][1] = "";}
    else
    {next_loop = false;}
    nOpac = opacity;
    }
    }
    if(ie5){
    obj.style.filter="alpha(opacity="+opacity+")";
    }
    if(ns6){
    obj.style.MozOpacity = opacity + '%';
    }
    }
    if (next_loop == false)
    {
    timer = setTimeout("changes()",speed);
    }
    else
    {
    clearTimeout(timer);
    }
    }

    //for each link option you need to make a new Array;
    var apl = new Array();
    apl[0] = new Array(45,"");
    apl[1] = new Array(45,"");
    apl[2] = new Array(45,"");
    apl[3] = new Array(45,"");
    apl[4] = new Array(45,"");
    apl[5] = new Array(45,"");
    apl[6] = new Array(45,"");
    apl[7] = new Array(45,"");
    //expl: apl[8] = new Array(45,"");
    </script>

    <body bgcolor="BLACK">
    <BR>
    <BR>
    <BR>
    <table style="border:1px RED; width:130;height:180" cellspacing=0 cellpadding=0>
    <tr><td align=center bgcolor=BLACK>
    <font size="7" face="bradley hand itc" color=RED><u>B4B</u></font><br>
    </td></tr>
    <tr><td align=center border=2>
    <table cellpadding=0 cellspacing=0 name=link_table id=link_table>
    <td class="tds" onmouseover="fadeImg2(0)" onmouseout="fadeImgend2(0)" onClick="window.open('http://www.b4b.jimxorb.com/forum/index.php');" style="font-family:bradley hand itc; border:1px solid RED; background-color:BLACK; width:100%; text-align:center; color:RED;">B4B Forum</td>
    </tr>
    <tr>
    <td class="tds" onmouseover="fadeImg2(1)" onmouseout="fadeImgend2(1)" onClick="top.frames['main'].location.href='http://www.the.iwarp.com/downloads.html';" style="font-family:bradley hand itc; border:1px solid RED; background-color:BLACK; width:100%; text-align:center; color:RED;">Downloads</td>
    </tr>
    <tr>
    <td class="tds" onmouseover="fadeImg2(2)" onmouseout="fadeImgend2(2)" onClick="top.frames['main'].location.href='http://robotarena.tk/';" style="font-family:bradley hand itc; border:1px solid RED; background-color:BLACK; width:100%; text-align:center; color:RED;">Links</td>
    </tr>
    <tr>
    <td class="tds" onmouseover="fadeImg2(3)" onmouseout="fadeImgend2(3)" onClick="top.frames['main'].location.href='http://www.the.iwarp.com/site.html';" style="font-family:bradley hand itc; border:1px solid RED; background-color:BLACK; width:100%; text-align:center; color:RED;">About Us</td>
    </tr>
    <tr>
    <td class="tds" onmouseover="fadeImg2(4)" onmouseout="fadeImgend2(4)" onClick="top.frames['main'].location.href='http://www.the.iwarp.com/iamgehost.html';" style="font-family:bradley hand itc; border:1px solid RED; background-color:BLACK; width:100%; text-align:center; color:RED;">Image Hosts</td>
    </tr>
    <tr>
    <td class="tds" onmouseover="fadeImg2(5)" onmouseout="fadeImgend2(5)" onClick="top.frames['main'].location.href='';" style="font-family:bradley hand itc; border:1px solid RED; background-color:BLACK; width:100%; text-align:center; color:RED;"></td>
    </tr>
    <tr>
    <td class="tds" onmouseover="fadeImg2(6)" onmouseout="fadeImgend2(6)" onClick="window.open('http://invisionfree.com/forums/Bots4Battle/');" style="font-family:bradley hand itc; border:1px solid RED; background-color:BLACK; width:100%; text-align:center; color:RED;">B5B Forum</td>
    </tr>
    <tr>
    <td class="tds" onmouseover="fadeImg2(7)" onmouseout="fadeImgend2(7)" onClick="window.open('http://teamicer.to-j.com/Forums/');" style="font-family:bradley hand itc; border:1px solid RED; background-color:BLACK; width:100%; text-align:center; color:RED;">Old Forum</td>
    </tr>
    </table>
    </td></tr></table>


    and heres it for the dropdown menu:

    <html>
    <head>

    <STYLE TYPE="text/css">
    <!--
    BODY {
    scrollbar-3d-light-color:RED;
    scrollbar-arrow-color:RED;
    scrollbar-base-color:RED;
    scrollbar-dark-shadow-color:RED;
    scrollbar-face-color:BLACK;
    scrollbar-highlight-color:BLACK;
    scrollbar-shadow-color:RED}
    //-->
    </style>

    <style type="text/css">
    a {
    text-decoration: none;
    }

    .mar {
    font-family: verdana, helvetica, sans-serif;
    font-size: 10px;
    color: 5F7F6E;
    font: bolder;
    }

    .title {
    position: absolute;
    width: 120px;
    height: 20px;
    left: 10px;
    z-index: 10;
    font-family: verdana, helvetica, sans-serif;
    font-weight: bold;
    font-size: 12px;
    }

    .submenu {
    position: absolute;
    left: 0px;
    width: 120px;
    border: 1px solid none;
    background-color: none;
    layer-background-color: none;
    font-family: verdana, helvetica, sans-serif;
    font-size: 10px;
    visibility: hidden;
    color: 0F2D19;
    font: bolder;
    }
    </style>

    <script language="Javascript">
    var nom = 4;
    var ttls = new Array();
    var subs = new Array();
    var lastn;
    var lastmove;

    if (document.layers) {
    visible = 'show';
    hidden = 'hide';
    }
    else if (document.all) {
    visible = 'visible';
    hidden = 'hidden';
    }
    for (var i = 1; i <= nom; i++) {
    ttls[i] = ('title' + i);
    subs[i] = ('submenu' +i);
    }

    lastn = (nom + 1);
    lastmove = 0;

    function lasttoggle(n,move) {
    if (n <= nom) {
    menu = ('submenu' + n);
    if (document.layers) {
    submenu = document.layers[menu];
    }
    else if (document.all) {
    submenu = document.all(menu).style;
    }
    if (submenu.visibility == visible) {
    submenu.visibility = hidden;
    for (var i = (n+1); i <= nom; i++) {
    if (document.layers) {
    document.layers[ttls[i]].top -= move;
    document.layers[subs[i]].top -= move;
    }
    else if (document.all) {
    document.all(ttls[i]).style.pixelTop -= move;
    document.all(subs[i]).style.pixelTop -= move;
    }
    }
    }
    }
    }

    function toggle(n,move) {
    menu = ('submenu' + n);
    if (document.layers) {
    submenu = document.layers[menu];
    }
    else if (document.all) {
    submenu = document.all(menu).style;
    }
    if (submenu.visibility == visible) {
    submenu.visibility = hidden;
    for (var i = (n+1); i <= nom; i++) {
    if (document.layers) {
    document.layers[ttls[i]].top -= move;
    document.layers[subs[i]].top -= move;
    }
    else if (document.all) {
    document.all(ttls[i]).style.pixelTop -= move;
    document.all(subs[i]).style.pixelTop -= move;
    }
    }
    }

    else {
    submenu.visibility = visible;
    if (lastn != n) {
    lasttoggle(lastn,lastmove);
    }
    for (var i = (n+1); i <= nom; i++) {
    if (document.layers) {
    document.layers[ttls[i]].top += move;
    document.layers[subs[i]].top += move;
    }
    if (document.all) {
    document.all(ttls[i]).style.pixelTop += move;
    document.all(subs[i]).style.pixelTop += move;
    }
    }
    }

    lastn = n;
    lastmove = move;
    }

    // -->
    </script>
    </HEAD>

    <BODY onLoad="window.status="#" bgcolor="BLACK" TEXT="RED" LINK="RED" VLINK="RED" ALINK="RED">

    <div class="title" id="title1" style="top: 120px">
    <a href="#" onclick="javascript: toggle(1,50); return false">TEST</a>
    <div class="submenu" id="submenu1" style="top: 25px">
    <a href="#" target="mainFrame">TEST</a><br>
    </div>
    </div>

    <div class="title" id="title2" style="top: 140px">
    <a href="#" onclick="javascript: toggle(2,50); return false">TEST</a>
    <div class="submenu" id="submenu2" style="top: 25px">
    <a href="#" target="mainFrame">TEST</a><br>
    <a href="#" target="mainFrame"></a><br>
    <a href="#" target="mainFrame"></a><br>
    <a href="#" target="mainFrame"></a><br>
    </div>
    </div>

    <div class="title" id="title3" style="top: 160px">
    <a href="#" onclick="javascript: toggle(3,50); return false">TEST</a>
    <div class="submenu" id="submenu3" style="top: 25px">
    <a href="#" target="mainFrame">TEST</a><br>
    <a href="#" target="mainFrame"></a><br>
    </div>
    </div>

    <div class="title" id="title4" style="top: 180px">
    <a href="#" onclick="javascript: toggle(4,50); return false">TEST</a>
    <div class="submenu" id="submenu4" style="top: 25px">
    <a href="#" target="mainFrame">TEST</a><br>
    <a href="#" target="mainFrame"></a><br>
    <a href="#" target="mainFrame"></a><br>
    <a href="#" target=_blank></a><br>
    <a href="#" target=_blank></a><br>

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

  4. #4
    Join Date
    Jul 2003
    Posts
    71
    no help then?

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center

"

"

X vBulletin 4.2.2 Debug Information

  • Page Generation 0.38290 seconds
  • Memory Usage 2,871KB
  • Queries Executed 13 (?)
More Information
Template Usage (32):
  • (1)SHOWTHREAD
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_global_above_footer
  • (1)ad_global_below_navbar
  • (1)ad_global_header1
  • (1)ad_global_header2
  • (1)ad_navbar_below
  • (1)ad_showthread_firstpost_sig
  • (1)ad_showthread_firstpost_start
  • (1)ad_thread_first_post_content
  • (1)ad_thread_last_post_content
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)headinclude_bottom
  • (4)memberaction_dropdown
  • (1)navbar
  • (4)navbar_link
  • (1)navbar_moderation
  • (1)navbar_noticebit
  • (1)navbar_tabs
  • (2)option
  • (4)postbit
  • (4)postbit_onlinestatus
  • (4)postbit_wrapper
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 

Phrase Groups Available (6):
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files (26):
  • ./showthread.php
  • ./global.php
  • ./includes/class_bootstrap.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/functions_navigation.php
  • ./includes/class_friendly_url.php
  • ./includes/class_hook.php
  • ./includes/class_bootstrap_framework.php
  • ./vb/vb.php
  • ./vb/phrase.php
  • ./includes/functions_facebook.php
  • ./includes/functions_calendar.php
  • ./includes/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_notice.php
  • ./packages/vbattach/attach.php
  • ./vb/types.php
  • ./vb/cache.php
  • ./vb/cache/db.php
  • ./vb/cache/observer/db.php
  • ./vb/cache/observer.php 

Hooks Called (70):
  • init_startup
  • friendlyurl_resolve_class
  • init_startup_session_setup_start
  • database_pre_fetch_array
  • database_post_fetch_array
  • init_startup_session_setup_complete
  • global_bootstrap_init_start
  • global_bootstrap_init_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • load_show_variables
  • load_forum_show_variables
  • global_state_check
  • global_bootstrap_complete
  • global_start
  • style_fetch
  • global_setup_complete
  • showthread_start
  • showthread_getinfo
  • strip_bbcode
  • friendlyurl_clean_fragment
  • friendlyurl_geturl
  • forumjump
  • cache_templates
  • cache_templates_process
  • template_register_var
  • template_render_output
  • fetch_template_start
  • fetch_template_complete
  • parse_templates
  • fetch_musername
  • notices_check_start
  • notices_noticebit
  • process_templates_complete
  • friendlyurl_redirect_canonical
  • showthread_post_start
  • showthread_query_postids
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • postbit_imicons
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_display_complete
  • memberaction_dropdown
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • build_navigation_data
  • build_navigation_array
  • check_navigation_permission
  • process_navigation_links_start
  • process_navigation_links_complete
  • set_navigation_menu_element
  • build_navigation_menudata
  • build_navigation_listdata
  • build_navigation_list
  • set_navigation_tab_main
  • set_navigation_tab_fallback
  • navigation_tab_complete
  • fb_like_button
  • showthread_complete
  • page_templates