CodinggetComputedStyle in IE

 

Press Ctrl+Enter to quickly submit your post
Quick Reply  
 
 
  
 From:  CHYRON (DSMITHHFX)   
 To:  ALL
40245.2 
Here's the script:

 

---
function contentpadding()   {
   var content = document.getElementById("content");
   var contentw = parseInt(window.getComputedStyle(content, null).width);
   var container = document.getElementById("container");
   var containerw = parseInt(window.getComputedStyle(container, null).width);
   //alert(contentw);
   var contentpadding = (containerw - contentw) / 2;
   if (containerw > 1040)   {
      document.getElementById("content").style.paddingLeft = contentpadding + 'px';
      document.getElementById("content").style.paddingRight = contentpadding + 'px';
   } else {
      document.getElementById("content").style.width = (contentw - 72) + 'px';      
   }   
}
---

I worked out to get the values in jquery:

$("#content").css({
   width: function(index, value) {
   alert(parseInt(value));
   }
});

Problem is, I suck at jquery.

T_T

 

0/0
 Reply   Quote More 

 From:  CHYRON (DSMITHHFX)   
 To:  ALL
40245.3 
I was getting all hung up on elaborate jquery syntax structures when the answer turned out to be dead simple. 2.5-hours later (drum roll)...

---
function contentpadding()   {
   var contentw = $("#content").css("width");
   var containerw = $("#container").css("width");
   var contentpadding = (parseInt(containerw) - parseInt(contentw)) / 2;
   if (parseInt(containerw) > 1040)   {
      document.getElementById("content").style.paddingLeft = contentpadding + 'px';
      document.getElementById("content").style.paddingRight = contentpadding + 'px';
   } else {
      document.getElementById("content").style.width = (contentw - 72) + 'px';      
   }
}
---
0/0
 Reply   Quote More 

 From:  af (CAER)  
 To:  CHYRON (DSMITHHFX)      
40245.4 In reply to 40245.3 
Do you know about box-sizing: border-box; ? I didn't read your code all that carefully but I have a feeling that might come in handy.

Oh and you should always specify the base parameter for parseInt() otherwise you'll get unexpected values if the strings you're parsing have leading zeroes.
caerphoto_sig.png
0/0
 Reply   Quote More 

 From:  CHYRON (DSMITHHFX)   
 To:  af (CAER)     
40245.5 In reply to 40245.4 
I wasn't aware of it (border-box). It looks like it could be very useful. Haven't had any problems with parseInt in my very limited use of it.
0/0
 Reply   Quote More 

 From:  af (CAER)  
 To:  CHYRON (DSMITHHFX)      
40245.6 In reply to 40245.5 
it was just a heads-up really – if you do
code:
parseInt("0034")
for example, you'll get 28 as a result, whereas if you do
code:
parseInt("0089")
you'll get either 0 or NaN.

In browsers which support ECMAScript 5, which is basically just Chrome at the moment,  this silly behaviour is removed and parseInt works how you'd expect. Still, best to be on the safe side.
caerphoto_sig.png
0/0
 Reply   Quote More 

Reply to All    
 

1–6

Rate my interest:

Adjust text size : Smaller 10 Larger

Beehive Forum 1.5.2 |  FAQ |  Docs |  Support |  Donate! ©2002 - 2024 Project Beehive Forum

Forum Stats