Changing Objects Via TagName & ClassName

[HotNoob]

Here is something that i found quite useful for images, especially when the host has external image fetching disabled in php.

Code: Select all

<script>
//this function fetches all tags with your desired class name, and resizes the object to fit within the defined parameters.
function sizeByTagClass(tagType,className, maxWidth, maxHeight)
  {
    a = document.getElementsByTagName(tagType)||document.getElementsByClass(className);
    for (i=0;i<a.length;i++)
    {
        if(a[i].className == className)
        {
          if(a[i].height >= maxHeight)
          {
             var scale = maxHeight/a[i].height;
              a[i].height *= scale;
          }
          if(a[i].width >= maxWidth)
          {
              var scale = maxWidth/a[i].width;
              a[i].height *= scale;
          }
        }
    }
  }
</script>


Here is an example on how to use this function

Code: Select all

<script>
sizeByTagClass('img','smImg', 385, 385);
function to()
{
  sizeByTagClass('img','smImg', 385, 385);
}
var g_tempInt = setInterval('to()', 2000); //this is for browsers that may struggle with this function.
</script>


Basically, it is using JavaScript to do CSS work, but with a lot more flexibility