/    Sign up×
Community /Pin to ProfileBookmark

onload="fadeLoop();" problems

Copy linkTweet thisAlerts:
Nov 05.2004

Revised:
My main question is:

How can I have the <body onload=”fadeLoop();” only target one javascript that I have on my site without affecting the other one?

You can view it [URL=http://www.intensedevelopment.net/AutoSanctuary/HTML/Tryout.html]here[/URL]

_____________________________________________________________________

Hi, I am in the process of designing a website and am running in some complications. I have two scripts running on my site, and they are confliction with one another.

  • 1. DHTML menu (supposted to be expandable)

  • 2. Fade in, Fade out image

    • They both work fine, just not in conjunction with one another due to the onload=”fadeLoop()”

    Now, I was wondering if the would be a quick fix on this or just another Fade In Fade out for images.

    Thanks for helping out!

    ________________________________________________________________

    <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”
    “http://www.w3.org/TR/html4/loose.dtd“>
    <html>
    <head>
    <title>Untitled</title>

    <LINK href=”META.css” type=’text/css’ rel=’stylesheet’>

    <script LANGUAGE=”JavaScript” SRC=”Menu/Highlight.js” TYPE=”text/javascript”></SCRIPT>
    <script language=”JavaScript” type=”text/javascript” src=”Menu/Test_scr.js”></script>

    <meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″>
    </head>

    <body topmargin=”0″ bottommargin=”0″ leftmargin=”0″ rightmargin=”0″ onload=”fadeLoop();”>

    <div style=”position:absolute;left:28%;top:12px;”><img src=”JS/Fade.jpg” border=”0″ id=”img1″ /></div>
    <div style=”position:absolute;left:28%;top:12px;”><img src=”JS/FadeIn.jpg” id=”img2″ /></div>

    <table cellpadding=’0′ cellspacing=’0′ border=’0′><tr><td><img src=”Menu/Test_m1_b.png” /></td></tr>
    <tr><td><a href=”javascript:void(0);” onmouseover=”exM(m1,’m1mn1′,’m1tlm0′,event);chgBg(m1,’m1tlm0′,3)” onmouseout=”coM(m1,’m1mn1′,’m1tlm0′);chgBg(m1,’m1tlm0′,0)”><img border=”0″ id=”m1tlm0″ src=”Menu/Test_m1_i0.png” /></a></td></tr>
    <tr><td><img src=”Menu/Test_m1_s.png” /></td></tr>
    <tr><td><a href=”javascript:void(0);” onmouseover=”exM(m1,’none’,”,event);chgBg(m1,’m1tlm1′,3)” onmouseout=”chgBg(m1,’m1tlm1′,0,1)”><img border=”0″ id=”m1tlm1″ src=”Menu/Test_m1_i1.png” /></a></td></tr>
    <tr><td><img src=”Menu/Test_m1_s.png” /></td></tr>
    <tr><td><a href=”javascript:void(0);” onmouseover=”exM(m1,’none’,”,event);chgBg(m1,’m1tlm2′,3)” onmouseout=”chgBg(m1,’m1tlm2′,0,1)”><img border=”0″ id=”m1tlm2″ src=”Menu/Test_m1_i2.png” /></a></td></tr>
    <tr><td><img src=”Menu/Test_m1_s.png” /></td></tr>
    <tr><td><a href=”javascript:void(0);” onmouseover=”exM(m1,’none’,”,event);chgBg(m1,’m1tlm3′,3)” onmouseout=”chgBg(m1,’m1tlm3′,0,1)”><img border=”0″ id=”m1tlm3″ src=”Menu/Test_m1_i3.png” /></a></td></tr>
    <tr><td><img src=”Menu/Test_m1_s.png” /></td></tr>
    <tr><td><a href=”javascript:void(0);” onmouseover=”exM(m1,’none’,”,event);chgBg(m1,’m1tlm4′,3)” onmouseout=”chgBg(m1,’m1tlm4′,0,1)”><img border=”0″ id=”m1tlm4″ src=”Menu/Test_m1_i4.png” /></a></td></tr>
    <tr><td><img src=”Menu/Test_m1_s.png” /></td></tr>
    <tr><td><a href=”javascript:void(0);” onmouseover=”exM(m1,’none’,”,event);chgBg(m1,’m1tlm5′,3)” onmouseout=”chgBg(m1,’m1tlm5′,0,1)”><img border=”0″ id=”m1tlm5″ src=”Menu/Test_m1_i5.png” /></a></td></tr>
    <tr><td><img src=”Menu/Test_m1_s.png” /></td></tr>
    <tr><td><a href=”javascript:void(0);” onmouseover=”exM(m1,’none’,”,event);chgBg(m1,’m1tlm6′,3)” onmouseout=”chgBg(m1,’m1tlm6′,0,1)”><img border=”0″ id=”m1tlm6″ src=”Menu/Test_m1_i6.png” /></a></td></tr>
    <tr><td><img src=”Menu/Test_m1_s.png” /></td></tr>
    <tr><td><a href=”javascript:void(0);” onmouseover=”exM(m1,’none’,”,event);chgBg(m1,’m1tlm7′,3)” onmouseout=”chgBg(m1,’m1tlm7′,0,1)”><img border=”0″ id=”m1tlm7″ src=”Menu/Test_m1_i7.png” /></a></td></tr>
    <tr><td><img src=”Menu/Test_m1_s.png” /></td></tr>
    <tr><td><a href=”javascript:void(0);” onmouseover=”exM(m1,’none’,”,event);chgBg(m1,’m1tlm8′,3)” onmouseout=”chgBg(m1,’m1tlm8′,0,1)”><img border=”0″ id=”m1tlm8″ src=”Menu/Test_m1_i8.png” /></a></td></tr>
    <tr><td><img src=”Menu/Test_m1_s.png” /></td></tr>
    <tr><td><a href=”javascript:void(0);” onmouseover=”exM(m1,’none’,”,event);chgBg(m1,’m1tlm9′,3)” onmouseout=”chgBg(m1,’m1tlm9′,0,1)”><img border=”0″ id=”m1tlm9″ src=”Menu/Test_m1_i9.png” /></a></td></tr>
    <tr><td><img src=”Menu/Test_m1_s.png” /></td></tr>
    <tr><td><a href=”javascript:void(0);” onmouseover=”exM(m1,’none’,”,event);chgBg(m1,’m1tlm10′,3)” onmouseout=”chgBg(m1,’m1tlm10′,0,1)”><img border=”0″ id=”m1tlm10″ src=”Menu/Test_m1_i10.png” /></a></td></tr>
    <tr><td><img src=”Menu/Test_m1_e.png” /></td></tr></table>

    </body>
    </html>

    to post a comment
    JavaScript

    7 Comments(s) ↴

    Copy linkTweet thisAlerts:
    @JPnycNov 05.2004 — I only see 1 function called onload, the fade one. Where's the conflict?
    Copy linkTweet thisAlerts:
    @IntensityauthorNov 05.2004 — The menu I have is dynamic and you will on the first listing that it has an arrow. There are some additional options to choose from. The onload=loop function prevents the dynamic menu from showing.
    Copy linkTweet thisAlerts:
    @IntensityauthorNov 06.2004 — My main question is:

    How can I have the <body onload="fadeLoop();" only target one javascript that I have on my site without affecting the other one?
    Copy linkTweet thisAlerts:
    @JPnycNov 06.2004 — It is only targeting one, the one you call onload. It's not possible that the call is causing the conflict. It must be a syntax error. Code generators tend to spit out lousy confusing code. Forget the HTML and post the code from both functions so we can look for possible conflict.

    What MAY be causing the conflict is, a browser can only run one function at a time. When 1 is running, and you call another, it will either interrupt the 1st, or the 2nd won't run. If you have a setTimeout() in the fade function, then try increasing the interval to give the other function a window to run it's thread.
    Copy linkTweet thisAlerts:
    @7studNov 06.2004 — Hi,

    My main question is:

    How can I have the <body onload="fadeLoop();" only target one javascript that I have on my site without affecting the other one?[/quote]

    That seems like a nonsensical question to me: you don't target 'javascripts'.

    If what you mean, ?, is that one function is preventing another function from executing when the onload event triggers. You can do this to solve that problem:

    &lt;script type="text/javascript"&gt;
    &lt;!-- Hide from browsers lacking javascript

    window.onload=onload_funcs;
    function onload_funcs()
    {
    function1(a,b);
    function2(x,y);
    }


    // End hiding --&gt;
    &lt;/script&gt;
    &lt;/head&gt;
    Copy linkTweet thisAlerts:
    @IntensityauthorNov 07.2004 — var SbrowseIE = navigator.appName;

    if(SbrowseIE == "Microsoft Internet Explorer") SbrowseIE = true;

    else SbrowseIE = false;

    function fadeImage(imgName, fadeVal){

    var opFilt;

    if (SbrowseIE){

    opFilt=document.getElementById(imgName).style.filter;

    opFilt=opFilt.substr(opFilt.indexOf("=")+1,opFilt.indexOf(")")-(opFilt.indexOf("=")+1));

    }

    else

    opFilt=document.getElementById(imgName).style.MozOpacity*100;

    if(opFilt <= 0 || opFilt >= 100)

    fadeVal=fadeVal*(-1);

    opFilt=opFilt-fadeVal;

    if (SbrowseIE)

    document.getElementById(imgName).style.filter="alpha(opacity="+opFilt+")";

    else

    document.getElementById(imgName).style.MozOpacity=opFilt/100;

    return fadeVal;

    }

    var fVal2;

    var firstTime=true;

    function fadeLoop(){

    if (firstTime){

    firstTime=false;

    fVal2=1;

    if (SbrowseIE){

    document.getElementById("img1").style.filter="alpha(opacity=90)";

    } else {

    document.getElementById("img1").style.MozOpacity=.9;

    }

    }

    fVal2=fadeImage("img2",fVal2);

    setTimeout("fadeLoop()",100);

    }




    __________________________________________________


    NS60=(navigator.userAgent.indexOf("Netscape6/6.0")!=-1)

    Opera=(navigator.userAgent.indexOf('Opera')!=-1)||(navigator.appName.indexOf('Opera')!=-1)||(window.opera)

    Opera7=(Opera&&document.createElement!=null&&document.addEventListener!=null)

    IE4=(document.all&&!Opera)

    mac=((IE4)&&(navigator.appVersion.indexOf("Mac")!=-1))

    DOM=document.documentElement&&!IE4&&!Opera

    NS4=navigator.appName.indexOf("Netscape")>-1&&!DOM

    mswnd=(navigator.appVersion.indexOf("Windows")!=-1||navigator.appVersion.indexOf("WinNT")!=-1)

    if(IE4){

    av=navigator.appVersion

    avi=av.indexOf("MSIE")

    if(avi==-1){version=parseInt(av);}else{version=parseInt(av.substr(avi+4));}}

    var ver='2.0.2'

    var m1=new Object

    m1.name='m1'

    m1.fnm='Test_m1'

    if(!window.lastm||window.lastm<1)lastm=1

    if(NS4||IE4||DOM||Opera){

    m1.v17=null

    m1.v17Timeout=''

    var maxZ=1000

    m1.v18

    m1.targetFrame

    var docLoaded=false

    m1.bIncBorder=true

    m1.v29=null

    m1.v29Str=''

    m1.scrollDelay=50

    m1.scrollStep=10

    m1.showDelayedTimeout=null

    m1.fadingSteps=8

    m1.v21="Menu"

    m1.maxlev=1

    m1.v22=0

    m1.bVarWidth=0

    m1.bShowDel=0

    m1.v23=160

    m1.levelOffset=0

    m1.bord=3

    m1.vertSpace=4

    m1.sep=0

    m1.v19=false

    m1.bkv=0

    m1.rev=0

    m1.shs=0

    m1.xOff=0

    m1.yOff=0

    m1.v20=false

    m1.cntFrame=""

    m1.menuFrame=""

    m1.v24=""

    m1.mout=true

    m1.iconSize=8

    m1.closeDelay=500

    m1.tlmOrigBg="#72D2FF"

    m1.tlmOrigCol="White"

    m1.v25=true

    m1.v52=true

    m1.popupOpacity=0

    m1.v11=true

    m1.rm=-1

    if(document.getElementById&&(!Opera||Opera7))m1.bord=0

    m1.v10=8

    m1.popupLeftPad=2

    m1.v01=2

    m1.tlmHlBg="#CCEEFF"

    m1.tlmHlCol="Aqua"

    m1.borderCol="#BCBCBC"

    m1.menuHorizontal=false

    m1.scrollHeight=6}

    m1.lev0=new Array("10px",true,false,"White","#72D2FF","Aqua","Verdana,Arial,Helvetica","Blue")

    m1.lev1=new Array("10px",true,false,"White","#72D2FF","Aqua","Verdana,Arial,Helvetica","Blue")

    m1mn1=new Array

    (

    "Intake","",0

    ,"Exhaust","",0

    )

    absPath=""

    if(m1.v19&&!m1.v20){

    if(window.location.href.lastIndexOf("")>window.location.href.lastIndexOf("/")) {sepCh = "" ;} else {sepCh = "/" ;}

    absPath=window.location.href.substring(0,window.location.href.lastIndexOf(sepCh)+1)}

    m1.popupOffset=1

    m1.v02=m1.v23

    if(DOM||IE4||Opera7){

    var stp="<img width=1 height=1 style='display:none' id="

    var stq=" src='Menu/Test_m1"

    document.write(stp+"'m1menubg4'"+stq+"bg4.png'>")

    document.write(stp+"'m1menubg5'"+stq+"bg5.png'>")

    document.write(stp+"'m1menubg6'"+stq+"bg6.png'>")

    document.write(stp+"'pre0m1tlm0'"+stq+"_i0.png'>")

    document.write(stp+"'pre1m1tlm0'"+stq+"_    i0h.png'>")

    document.write(stp+"'pre0m1tlm1'"+stq+"_i1.png'>")

    document.write(stp+"'pre1m1tlm1'"+stq+"_    i1h.png'>")

    document.write(stp+"'pre0m1tlm2'"+stq+"_i2.png'>")

    document.write(stp+"'pre1m1tlm2'"+stq+"_    i2h.png'>")

    document.write(stp+"'pre0m1tlm3'"+stq+"_i3.png'>")

    document.write(stp+"'pre1m1tlm3'"+stq+"_    i3h.png'>")

    document.write(stp+"'pre0m1tlm4'"+stq+"_i4.png'>")

    document.write(stp+"'pre1m1tlm4'"+stq+"_    i4h.png'>")

    document.write(stp+"'pre0m1tlm5'"+stq+"_i5.png'>")

    document.write(stp+"'pre1m1tlm5'"+stq+"_    i5h.png'>")

    document.write(stp+"'pre0m1tlm6'"+stq+"_i6.png'>")

    document.write(stp+"'pre1m1tlm6'"+stq+"_    i6h.png'>")

    document.write(stp+"'pre0m1tlm7'"+stq+"_i7.png'>")

    document.write(stp+"'pre1m1tlm7'"+stq+"_    i7h.png'>")

    document.write(stp+"'pre0m1tlm8'"+stq+"_i8.png'>")

    document.write(stp+"'pre1m1tlm8'"+stq+"_    i8h.png'>")

    document.write(stp+"'pre0m1tlm9'"+stq+"_i9.png'>")

    document.write(stp+"'pre1m1tlm9'"+stq+"_    i9h.png'>")

    document.write(stp+"'pre0m1tlm10'"+stq+"_i10.png'>")

    document.write(stp+"'pre1m1tlm10'"+stq+"_    i10h.png'>")

    document.write(stp+"'pre0m1tlm11'"+stq+"_i11.png'>")

    document.write(stp+"'pre1m1tlm11'"+stq+"_    i11h.png'>")

    document.write(stp+"'pre0m1tlm12'"+stq+"_i12.png'>")

    document.write(stp+"'pre1m1tlm12'"+stq+"_    i12h.png'>")}

    if(Opera&&!Opera7)document.write("<"+"script language='JavaScript1.2' src='Menu/menu_opera.js'><"+"/"+"script>")

    else if(NS4)document.write("<"+"script language='JavaScript1.2' src='Menu/menu_ns4.js'><"+"/"+"script>")

    else if(document.getElementById)document.write("<"+"script language='JavaScript1.2' src='Menu/menu_dom.js'><"+"/"+"script>")

    else document.write("<"+"script language='JavaScript1.2' src='Menu/menu_ie4.js'><"+"/"+"script>")

    document.write("<style type='text/css'>n")

    document.write(".m1CL0,.m1CL0:link{text-decoration:none;color:White; }n")

    document.write(".m1CL0:visited{color:White}n")

    document.write(".topFold{position:"+(!DOM&&!IE4?"relative":"static")+"}n")

    if(NS4&&!m1.v25)document.write(".x1{padding-left:5px;padding-right:-3px;}n")

    document.write(".m1mit{"+((!NS4||m1.v25)?"padding-left:5px;padding-right:-3px;":"")+"color:White; font-weight:bold; font-family:Verdana,Arial,Helvetica; font-size:10px; padding-top:0px;padding-bottom:0px}n")

    document.write("</style>nn")
    Copy linkTweet thisAlerts:
    @JPnycNov 07.2004 — Ok, with a timeout of 100 milliseconds, that fade function is ALWAYS running. Browsers are not multi-threaded applications. They can't run more than one function at a time. Make that 100 setTimeout into 1000 or 2000 and see if the other function can run in between. Then at least you'll know what the problem is. May not be able to suit your purpose, but at least you won't have to chase a solution that doesn't exist.
    ×

    Success!

    Help @Intensity spread the word by sharing this article on Twitter...

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 — BETA 6.17,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @nearjob,
    tipped: article
    amount: 1000 SATS,

    tipper: @meenaratha,
    tipped: article
    amount: 1000 SATS,

    tipper: @meenaratha,
    tipped: article
    amount: 1000 SATS,
    )...