SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,737
    Mentioned
    32 Post(s)
    Tagged
    1 Thread(s)

    Javascript works only in FF?!?

    I am trying to do some optimized unobtrusive scripting. Basically creating a script that allows me to switch classes on a series of elements. It works perfectly in Firefox, but ALL OTHER browsers are ignoring my script completely. I've gone over it with a fine tooth comb, not that it is such a large script anyway, but I am a bit of a noob and I must be missing something stupid. a typo? a declaration that FF forgives but that other browsers cant live w/o? Am at a loss ... suggestions are greatly appreciated:


    <style type="text/css">
    ul{width:25&#37;}
    li{ list-style-position:inside}
    li *:first-child {display:inline;}
    li:hover{background: pink}
    </style>

    <script type="text/javascript">
    function foo(ids , els){
    IDcount=ids.length;

    for (a=0; a< IDcount; a++){
    curEL=els[a];
    curID=document.getElementById(ids[a]);
    children=curID.getElementsByTagName(curEL);
    childCount=children.length;
    for (i=0; i< childCount; i++){
    children[i].OnMouseOver=function(){ plusClass("over",this);};
    children[i].OnMouseOut=function(){ minusClass("over",this);};
    }
    }
    }
    function plusClass(class, eli){
    eli.className+=" "+class;
    }
    function minusClass(class, eli){

    oldclass=eli.className;
    class2=" "+class;
    if (oldclass.indexOf(class2)>-1){ newclass=eli.className.replace(class2,""); eli.className=newclass;}
    }


    </script>
    <style type="text/css">
    .over{color:red}
    </style>
    </head>

    <body onLoad="f<h2></h2>oo">

    <ul id="name">
    <li>
    <p>lorem ipsum something something. </p>
    <p>lorem ipsum something something. </p>

    </li>
    <li>
    <p>lorem ipsum something something. </p>
    </li>
    <li>
    <p>lorem ipsum something something. </p>
    <p>lorem ipsum something something. </p>

    </li>
    <li>
    <p>lorem ipsum something something. </p>

    </li>
    <li>
    <p>lorem ipsum something something. </p>
    <p>lorem ipsum something something. </p>
    <p>lorem ipsum something something. </p>
    </li>



    </ul>

    <script type="text/javascript">
    var IDlist= new Array("name");//IDs to watch go in the parentehsis
    var ELlist= new Array("LI");//corresponding elements go in the parentehsis
    foo(IDlist, ELlist);
    </script>
    </body>
    </html>

  2. #2
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,737
    Mentioned
    32 Post(s)
    Tagged
    1 Thread(s)
    oops
    I caught the
    <body onLoad="f<h2></h2>oo">.. thats supposed to be
    <body onLoad="foo('name','ul')">
    stiil doesnt work tho

  3. #3
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,737
    Mentioned
    32 Post(s)
    Tagged
    1 Thread(s)
    Well I resolved my own problem .. I'm so proud, hahah. Just in case anyone finds this post when looking for an answer to a similar problem.. it WAS a stupid thing that broke my script. "class" is a reserved word in javascript and cannot be used as a variable name. BLAST! For some reason, Firefox allows it tho which is one reason I was so thoroughly confused Thank goodness for script validators.


Bookmarks

Posting Permissions

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