using CCS value in Javascript code

Discussion in 'HTML & Website Design' started by Benjamins, Aug 26, 2009.

0
  1. #1
    I would like to use the width I've given in CSS with a variable in Javascript.

    div.lilac {background-color:#5D0866;
    padding:0;
    text-indent:1em;
    width:70em;}

    I tried:

    <script type="text/javascript">
    var boxbreite = div.lilac.width;
    </script>

    but that was probably silly ;-)


    I'm a very beginner. Could someone help please?
     
    Benjamins, Aug 26, 2009 IP
  2. 1 FineLine

    1 FineLine Peon

    Messages:
    78
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #2
    1 FineLine, Aug 26, 2009 IP
  3. shazin

    shazin Guest

    Messages:
    93
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Easiest solution is to use some JavaScript library like jQuery and write something like:

    var $width = $('div.lilac').attr('width');
     
    shazin, Aug 26, 2009 IP
  4. optimeramera

    optimeramera Peon

    Messages:
    26
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    You could get the width from the element that is assigned the class, like this:

    <html>
<head>
<style>
div.lilac { background-color:#5D0866; padding:0; text-indent:1em; width:700px; }
</style>
</head>
<body>

<div id="thingy" class="lilac">
I am the lilac
</div>

<script type="text/javascript">
	alert(document.getElementById("thingy").offsetWidth);
</script>

</body>
</html>
    Code (markup):
     
    optimeramera, Aug 26, 2009 IP