SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Zealot
    Join Date
    Nov 2002
    Posts
    194
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    using a JS function on all divs of a certain class?

    When the page loads I want it to go through a certain function for every div of a certain class. I'm new to js though, could someone help me out please?

  2. #2
    SitePoint Addict
    Join Date
    Aug 2001
    Location
    Los Angeles, CA
    Posts
    346
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    and you want to do this because? And is there something you want to do to each DIV as you go through each one? More info dude...

  3. #3
    SitePoint Zealot
    Join Date
    Nov 2002
    Posts
    194
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    on my forums I want to cut off users signatures at a certain height, using overflow:hidden, but I need a way so that it sets all sig heights to 100px only if they are over 100px. I have a function that will do it, for example if I set onMouseOver="myfunction(this)" when I move the mouse over the sig it cuts it down to 100px if needed, else it leaves it alone, I need a way to do that automaticly, instead of having it be on mouseover. does that help?

  4. #4
    SitePoint Addict
    Join Date
    Aug 2001
    Location
    Los Angeles, CA
    Posts
    346
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Why don't you use normal CSS to do this? Just set everyone's sig to 100px. I don't see why you would need to introduce JS into this in order for it to be done.

    In the mean time, I'm going to think of how to write this script... I just wanted to let you know though that there is an easier alternative which is more compatible with browsers too (although the white space for each sig may get a bit annoying).

  5. #5
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    These two functions should get you what you need.
    Code:
    function getDivsByClassName (reqClass) {
       var divsInClass = new Array();
       var divs = document.getElementsByTagName("div");
       for(var x = 0; y = divs.length; x < y; x++) {
           if (divs[x].className == reqClass) {
             divsInClass.length++;
             divsInClass[divsInClass.length] = divs[x];
           }
        }
       return divsInClass;
    }
    
    function changeAllDivs(reqClass) {
       var allClass = getDivsByClassName(reqClass);
       for (var x = 0; y = allClass.length; x < y; x++) {
         allClass[x].style.height = "100px";
         allClass[x].style.overflow = "hidden";
       }
    }
    Last edited by vgarcia; Jun 17, 2003 at 11:02.

  6. #6
    SitePoint Wizard silver trophy
    Join Date
    May 2003
    Posts
    1,843
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    var allDIVs = document.getElementsByTagName('div');
    
    onload = function() {
         var div, i = 0;
         while (div = allDIVs.item(i++))
                  if (div.className == 'some_class')
                      div.style.height = '100px';
    }
    ::: certified wild guess :::

  7. #7
    SitePoint Zealot
    Join Date
    Nov 2002
    Posts
    194
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks a bunch! The reason I'm using js and not just CSS is because I want the div to shrink to the height of the sig, so if I just set it to 100px even if it was just one line of text it would still take up 100px of vertical space.

  8. #8
    SitePoint Wizard silver trophy
    Join Date
    May 2003
    Posts
    1,843
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You explained that quite nicely in your original post (for those of us who actually read it).
    ::: certified wild guess :::


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
  •