• Gender: Male
  • From: Indiana
  • Registered: 2009-02-26
  • Posts: 51

Topic: Deprecrated 'value' in js. Replace?

I have a nice looking menu i found, but the java for it refers it to a deprecated term. it uses 'value' in the <li> tag.
Can I replace this in a simple fashion? It's not necessary so I'm willing to just remove the value from the tag and leave the java be.
I also wanted to know if the 'value' of value can be changed by clicking a link in that line without loading a new page.
I have an idea that involves multiple DIVs and INCludes but it seems too complicated to work.

the html

<li value="1"><a id="carrot" href="javascript:showonlyone('carrot');" >VEGGIE</a></li>
<li><a id="banana" href="javascript:showonlyone('banana');" >FRUIT</a></li>

the line of code

var c,v; c=e[i]; v=c.value; if(v==1){s=c; w=c.offsetWidth; p=c.offsetLeft}

the full script

var menuSlider=function(){
    var m,e,g,s,q,i; e=[]; q=8; i=8;
    return{
        init:function(j,k){
            m=document.getElementById(j); e=m.getElementsByTagName('li');
            var i,l,w,p; i=0; l=e.length;
            for(i;i<l;i++){
                var c,v; c=e[i]; v=c.value; if(v==1){s=c; w=c.offsetWidth; p=c.offsetLeft}
                c.onmouseover=function(){menuSlider.mo(this)}; c.onmouseout=function(){menuSlider.mo(s)};
            }
            g=document.getElementById(k); g.style.width=w+'px'; g.style.left=p+'px';
        },
        mo:function(d){
            clearInterval(m.tm);
            var el,ew; el=parseInt(d.offsetLeft); ew=parseInt(d.offsetWidth);
            m.tm=setInterval(function(){menuSlider.mv(el,ew)},i);
        },
        mv:function(el,ew){
            var l,w; l=parseInt(g.offsetLeft); w=parseInt(g.offsetWidth);
            if(l!=el||w!=ew){
                if(l!=el){var ld,lr,li; ld=(l>el)?-1:1; lr=Math.abs(el-l); li=(lr<q)?ld*lr:ld*q; g.style.left=(l+li)+'px'}
                if(w!=ew){var wd,wr,wi; wd=(w>ew)?-1:1; wr=Math.abs(ew-w); wi=(wr<q)?wd*wr:wd*q; g.style.width=(w+wi)+'px'}
            }else{clearInterval(m.tm)}
}};}();
  • Gender: Male
  • From: Indiana
  • Registered: 2009-02-26
  • Posts: 51

Re: Deprecrated 'value' in js. Replace?

AndaleTheGreat wrote:

It's not necessary so I'm willing to just remove the value from the tag...

seems i didn't realize, if i remove the value then all my divs are exposed at once, so that won't do.

  • Gender: Male
  • From: Indiana
  • Registered: 2009-02-26
  • Posts: 51

Re: Deprecrated 'value' in js. Replace?

I'd still like to find out how to make the java look at some other value.
I changed the original setup of this NavBar to show a DIV when clicked instead of changing pages. This means I'm not reloading the page and therefore not able to simple change value="1" to another <li>
I had an idea but don't know how to implement it.
Solutions:
I could use onload to set the HOME value to 1.
I could use onclick to change the value (which I realize is deprecated, but noone has had a solution to that issue either) to 1.
Problems:
onload not available for <li>
I don't know how to correctly implement onclick events at all
how would I devalue the other <li>s

  • Registered: 2009-04-30
  • Posts: 102

Re: Deprecrated 'value' in js. Replace?

What are you trying to do?

Perhaps show me an example/online page so that I can see.

Why do you need to store values to <li> ? You can't use ID or Class when you want to store "1" because ID and Class cannot start with numbers.

onload is not available to anything except <body> tag because its called when the page finishes loading, not one element. However you can use onload to fire a function that can manipulate the <li>'s

Show me an example/online page then we can start from there.

  • Gender: Male
  • From: Indiana
  • Registered: 2009-02-26
  • Posts: 51

Re: Deprecrated 'value' in js. Replace?

sorry, i forget that i don't have that in my sig on this forum
testsite dot daybreakphotography dot org

the value of one on the line marks the springback point of the 'slide' in the navbar

  • Registered: 2009-04-30
  • Posts: 102

Re: Deprecrated 'value' in js. Replace?

Ok so I see that you're trying to make an animated menu?

What you're trying to achieve can be implemented very easily using jQuery and a plugin for it called LavaLamp. You can read a very good tutorial on how to implement it on the following page:

http://www .gmarwaha .com/blog/2007/08/23/lavalamp-for-jquery-lovers/

The second example down the page is perhaps exactly identical to what you're trying to do.

This menu doesn't use "value" attribute and it should pass validation.

Have a look and try to implement it, and if you need help or stuck on something then post it here.

  • Gender: Male
  • From: Indiana
  • Registered: 2009-02-26
  • Posts: 51

Re: Deprecrated 'value' in js. Replace?

great advice BeeDev
everything worked out great in the end
it took me a few hours cuz 1 thing after another would surprise me, turns out my biggest issue was things with the same name.
Now my only issue is trying to move the text  into center of photo

  • Registered: 2009-04-30
  • Posts: 102

Re: Deprecrated 'value' in js. Replace?

I see that you've implemented Lavalamp already smile Nice one, and glad I could help.

You've got 1 Javascript error, from one of the <script> at the bottom of the page, something to do with doFormatField function big_smile If you don't have Firebug for Firefox then get it. Good luck.

  • Gender: Male
  • From: Indiana
  • Registered: 2009-02-26
  • Posts: 51

Re: Deprecrated 'value' in js. Replace?

yah, i forgot to upload my last change to remove that script last night. I could get it to work anyway.
oh yah, the second i saw how it was implemented i knew i would use it. my problem before was that I couldn't create a value change (since I don't really know .js at all).
It works perfectly with my hidden DIVs setup.
All that's really left is to stop screwing around with little stuff and clean it up so everything has actual links and not '/css/style.css'
Also, I can't get it to stop downloading the larger versions of photos I have linked, but that's for another topic area